Angular 2,TypeScript和ui-router - 如何获取状态参数

Question

嘿大家我想知道如何使用Angular 2,TypeScript和ui-router从状态获取状态参数.我尝试查看新文档,但他们似乎没有很多关于ng2 ui-router的文档.

下面我添加了我的component.ts以供参考.任何帮助将不胜感激.

import {Component} from '@angular/core';
import {HTTP_PROVIDERS} from '@angular/http';
import {UIRouter} from 'ui-router-ng2/router';

@Component({
  selector: 'Detail',
  template: require('./detail.html'),
  providers: [HTTP_PROVIDERS]
})

export class Detail {
  constructor(private uiRouter:UIRouter) {
    console.log('uiRouter ', this.uiRouter.globals.params);
  }
}

在Angular 1中,我会这样做:

(function() {
  'use strict';

  angular
  .module('private')
  .controller('Controller', Controller);

  function Controller($state) {
    var vm = this;
    console.log($state.params.studentID);
  }
})();

再次任何建议将不胜感激.

Answer 1

我能够通过执行以下操作解决我遇到的状态参数问题：

import {Component} from '@angular/core';
import {HTTP_PROVIDERS} from '@angular/http';
import {UIROUTER_DIRECTIVES} from 'ui-router-ng2';
import {UIRouter} from 'ui-router-ng2/router';

@Component({
  selector: 'Detail',
  template: require('./detail.html'),
  directives: [UIROUTER_DIRECTIVES],
  providers: [HTTP_PROVIDERS]
})

export class Detail {
    public detailParam: any;

    constructor(private uiRouter:UIRouter) {
      this.detailParam = this.uiRouter.globals.params;
      console.log('state params: ', this.detailParam);
  }
}

但经过更多研究后，我在这里找到了关于 Angular 2 的 ui-router 的更好文档： https: //ui-router.github.io/ng2/

看起来处理状态参数的正确方法是

import {Transition} from "ui-router-ng2"

并使用

trans.params().detailID

我无法让 trans.params() 在这个特定时刻工作，但至少我找到了一个临时解决方案和更好的文档来找到正确的解决方案。