我正在使用 AngularJS v1.2.0-rc.2 和 ui-router v0.2.0。我想将引用状态传递给另一个状态，所以我使用toParamsof$state.go像这样：
$state.go('toState', {referer: $state.current.name});
根据文档，这应该填充控制器$stateParams上的toState，但它是undefined. 我错过了什么？
我创建了一个 plunk 来演示：
问问题
229036 次
14 回答
148
如果要传递非 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 的情况下转换状态的强大方法。
于 2014-05-29T18:38:11.437 回答
47
Nathan Matthews 的解决方案对我不起作用，但它是完全正确的，但找到解决方法没有什么意义：
关键点是：$state.go 的定义参数的类型和toParamas 在状态转换的两边应该是同一个数组或者对象。
例如，当您在如下状态下定义参数时，您的意思是参数是数组，因为使用了“[]”：
$stateProvider
.state('home', {
templateUrl: 'home',
controller: 'homeController'
})
.state('view', {
templateUrl: 'overview',
params: ['index', 'anotherKey'],
controller: 'overviewController'
})
所以你也应该像这样将 toParams 作为数组传递：
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，您还应该使用对象而不是数组：
$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;
});
于 2014-10-05T15:24:58.900 回答
28
我所要做的就是像这样在 url 状态定义中添加一个参数
url: '/toState?referer'
嗬！
于 2013-10-22T11:46:28.410 回答
15
不确定它是否适用于 AngularJS v1.2.0-rc.2 和 ui-router v0.2.0。我已经使用 ui-router v0.2.13 在 AngularJS v1.3.14 上测试了这个解决方案。
我只是意识到没有必要按照 gwhn 的建议在 URL 中传递参数。
只需在状态定义中添加带有默认值的参数即可。您的状态仍然可以有一个 Url 值。
$stateProvider.state('state1', {
url : '/url',
templateUrl : "new.html",
controller : 'TestController',
params: {new_param: null}
});
并将参数添加到$state.go()
$state.go('state1',{new_param: "Going places!"});
于 2015-03-06T22:18:55.473 回答
15
此页面上的这些示例都不适合我。这是我用过的，效果很好。一些解决方案说你不能将 url 与 $state.go() 结合起来，但这不是真的。尴尬的是您必须定义 url 的参数并列出参数。两者都必须在场。在 Angular 1.4.8 和 UI Router 0.2.15 上测试。
在状态中将您的参数添加到状态结束并定义参数：
url: 'view?index&anotherKey',
params: {'index': null, 'anotherKey': null}
在您的控制器中，您的 go 语句将如下所示：
$state.go('view', { 'index': 123, 'anotherKey': 'This is a test' });
然后将参数拉出并在新状态的控制器中使用它们（不要忘记将 $stateParams 传递给您的控制器函数）：
var index = $stateParams.index;
var anotherKey = $stateParams.anotherKey;
console.log(anotherKey); //it works!
于 2016-01-12T16:58:15.287 回答
11
就我而言，我尝试了这里给出的所有选项，但没有一个能正常工作（angular 1.3.13、ionic 1.0.0、angular-ui-router 0.2.13）。解决方案是：
.state('tab.friends', {
url: '/friends/:param1/:param2',
views: {
'tab-friends': {
templateUrl: 'templates/tab-friends.html',
controller: 'FriendsCtrl'
}
}
})
在 state.go 中：
$state.go('tab.friends', {param1 : val1, param2 : val2});
干杯
于 2015-07-03T05:44:16.457 回答
8
我花了很多时间与 Ionic / Angular 的 $state 和 $stateParams;
要使用 $state.go() 和 $stateParams，您必须设置某些内容，并且不得存在其他参数。
在我的 app.config() 中，我包含了 $stateProvider 并在其中定义了几个状态：
$stateProvider
.state('home', {
templateUrl: 'home',
controller: 'homeController'
})
.state('view', {
templateUrl: 'overview',
params: ['index', 'anotherKey'],
controller: 'overviewController'
})
params关键尤其重要。同样，请注意没有url键存在......使用 stateParams 和 URL 不混合。它们相互排斥。
在 $state.go() 调用中，将其定义为：
$state.go('view', { 'index': 123, 'anotherKey': 'This is a test' })
和$ indexstateParams变量只有在 $stateController定义键anotherKey中首先列出时才会被填充。params
在控制器中，包括 $stateParams，如图所示：
app.controller('overviewController', function($scope, $stateParams) {
var index = $stateParams.index;
var anotherKey = $stateParams.anotherKey;
});
传递的变量应该可用！
于 2014-09-08T21:29:31.767 回答
6
试试看reload: true？
最长时间无法弄清楚发生了什么 - 原来我在自欺欺人。如果您确定事情写得正确并且您将使用相同的状态，请尝试reload: true：
.state('status.item', {
url: '/:id',
views: {...}
}
$state.go('status.item', { id: $scope.id }, { reload: true });
希望这可以节省您的时间！
于 2015-07-24T02:15:14.787 回答
6
我遇到过类似的问题。经过大量的谷歌搜索和试验和测试，我最终得到了一个可行的解决方案。这是我的解决方案，对您有用。
我有两个控制器 - searchBoxController和stateResultController以及一个名为searchQuery的参数，该参数从具有搜索框的视图传递到显示从远程服务器获取的结果的视图。这就是你的做法：
下面是您从中调用下一个视图的控制器$state.go()
.controller('searchBoxController', function ($scope, $state) {
$scope.doSearch = function(){
var searchInputRaw = $scope.searchQueryInput;
$state.go('app.searchResults', { searchQuery: searchInput });
}
})
以下是执行时将调用的状态$state.go()：
.state('app.searchResults',
{
url: '/searchResults',
views:
{
'menuContent': { templateUrl: 'templates/searchResult.html', controller: 'stateResultController' }
},
params:
{
'searchQuery': ''
}
})
最后，与状态关联的控制器app.searchResults：
.controller('stateResultController', function ($scope, $state, $stateParams, $http) {
$scope.searchQueryInput = $stateParams.searchQuery;
});
于 2017-02-07T06:08:21.043 回答
3
在我的父/子状态中。在子状态中声明的所有参数都必须由父状态知道
.state('full', {
url: '/full',
templateUrl: 'js/content/templates/FullReadView.html',
params: { opmlFeed:null, source:null },
controller: 'FullReadCtrl'
})
.state('full.readFeed', {
url: '/readFeed',
views: {
'full': {
templateUrl: 'js/content/templates/ReadFeedView.html',
params: { opmlFeed:null, source:null },
controller: 'ReadFeedCtrl'
}
}
})
于 2016-05-02T04:13:54.260 回答
2
我们得到的解决方案是采用 2 个参数的状态正在改变：
.state('somestate', {
url: '/somestate',
views: {...}
}
至
.state('somestate', {
url: '/somestate?id=:&sub=:',
views: {...}
}
于 2015-01-20T22:51:24.127 回答
1
您在 router.js 中定义以下内容
$stateProvider.state('users', {
url: '/users',
controller: 'UsersCtrl',
params: {
obj: null
}
})
您的控制器需要添加 $stateParams。
function UserCtrl($stateParams) {
console.log($stateParams);
}
您可以通过参数发送对象，如下所示。
$state.go('users', {obj:yourObj});
于 2018-08-14T08:23:06.763 回答
1
我试图从第 1 页导航到第 2 页，并且还必须传递一些数据。
在我的router.js中，我添加了参数名称和年龄：
.state('page2', {
url: '/vehicle/:source',
params: {name: null, age: null},
.................
在Page1中，单击下一个按钮：
$state.go("page2", {name: 'Ron', age: '20'});
在Page2中，我可以访问这些参数：
$stateParams.name
$stateParams.age
于 2019-02-15T09:17:51.650 回答
0
如果这是您要像这样传递的查询参数：
/toState?referer=current_user
那么你需要像这样描述你的状态：
$stateProvider.state('toState', {
url:'toState?referer',
views:{'...'}
});
来源：https ://github.com/angular-ui/ui-router/wiki/URL-Routing#query-parameters
于 2015-07-09T17:03:19.630 回答