如何使用$state.go Params和$state Params发送和检索参数?

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (2)
  • 关注 (0)
  • 查看 (25)

我在ui-router v0.2.0上使用AngularJS v1.2.0-rc.2。我想将引用状态传递给另一个状态,所以我使用如下toParams的方式$state.go

$state.go('toState', {referer: $state.current.name});

根据文档,这应该填充$stateParamstoState控制器上,但它是undefined。我错过了什么?

http://plnkr.co/edit/ywEcG1

提问于
用户回答回答于

Nathan Matthews的解决方案对我来说不起作用,但它完全正确,但没有什么意义可以达成解决方法:

关键点是:定义参数的类型和$ state.go的toParamas应该是状态转换两侧的相同数组或对象。

例如,当你在一个状态中定义一个参数时,你的意思是params是数组,因为使用了“[]”:

$stateProvider
.state('home', {
    templateUrl: 'home',
    controller:  'homeController'
})
.state('view', {
    templateUrl: 'overview',
    params:      ['index', 'anotherKey'],
    controller:  'overviewController'
})

所以你也应该像这样传递给PARAMS:

params = { 'index': 123, 'anotherKey': 'This is a test' }
paramsArr = (val for key, val of params)
$state.go('view', paramsArr)

你可以像这样通过$ stateParams访问它们:

app.controller('overviewController', function($scope, $stateParams) {
    var index = $stateParams[0];
    var anotherKey = $stateParams[1];
});

更好的解决方案是在对象中使用对象而不是数组

$stateProvider
.state('home', {
    templateUrl: 'home',
    controller:  'homeController'
})
.state('view', {
    templateUrl: 'overview',
    params:      {'index': null, 'anotherKey': null},
    controller:  'overviewController'
})

我用参数定义中的{}替换了{}。为了将toParams传递给$ state.go,还应该使用object而不是array:

$state.go('view', { 'index': 123, 'anotherKey': 'This is a test' })

那么你可以通过$ stateParams轻松访问它们:

app.controller('overviewController', function($scope, $stateParams) {
    var index = $stateParams.index;
    var anotherKey = $stateParams.anotherKey;
});
用户回答回答于

如果你想传递非URL的状态,那么你url在设置你的时候一定不要使用state

$stateProvider.state('toState', {
  templateUrl:'wokka.html',
  controller:'stateController',
  params: {
    'referer': 'some default', 
    'param2': 'some default', 
    'etc': 'some default'
  }
});

然后,你可以像这样导航到它:

$state.go('toState', { 'referer':'jimbob', 'param2':37, 'etc':'bluebell' });

要么:

var result = { referer:'jimbob', param2:37, etc:'bluebell' };
$state.go('toState', result);

因此在HTML中:

<a ui-sref="toState(thingy)" class="list-group-item" ng-repeat="thingy in thingies">{{ thingy.referer }}</a>

这个用例在文档中完全没有被发现,但我认为这是在不使用URL的情况下转换状态的强大手段。

扫码关注云+社区