基于ui-router的页面跳转传参
① app.js中
.state('faceWarning',{
url: '/faceWarning',
templateUrl: 'pages/face/faceWarning.html',
controller: 'WarningCtrl'
})
.state('faceWarningList',{
url: '/faceWarningList/:groupId',
templateUrl: 'pages/face/faceWarningList.html',
controller: 'WarningListCtrl'
})
② faceWarning.html中点击跳转事件
ng-click="jumpWarningList(data.groupId)"
faceWarning.js中,定义页面跳转函数 (使用ui-router的$state.go接口):
faceApp.controller('WarningCtrl', ['$rootScope', '$scope', '$state',
function($rootScope, $scope, $state) {
$scope.jumpWarningList = function(groupId) {
$state.go('faceWarningList', {groupId: groupId});
};
}]);
③ faceWarningList.js,通过ui-router的$stateParams获取参数groupId
faceApp.controller('WarningCtrl', ['$rootScope', '$scope', '$stateParams',
function($rootScope, $scope, $stateParams) {
$scope.searchSpecial.groupId = $stateParams.groupId;
}]);
这种跳转,在不传递参数时,url: '/faceWarningList/:groupId', 这里将会影响单独跳转的实现,导致点击无效。
如果要实现单独点击跳转(主页面不带参数跳转),需要在app.js中定义参数,不然$state.go在传输之后在目标controller接受的时候会被filter过滤掉
.state('faceWarningList',{
url: '/faceWarningList',
templateUrl: 'pages/face/faceWarningList.html',
params: {'groupId': null},
controller: 'WarningListCtrl'
})