angularjs不同页面间参数的传递

1、在路由中定义要接收的参数

.state('userDetails', {

                url: '/userDetails?phone',    //以？为标识接收参数

                templateUrl: 'assets/views/userDetails.html',

                controller:'userDetailsController'     //也可以用 params:{'phone':{}}

})

2、在控制器中传递参数

.controller('pageOneCtrl', function ($scope, $state) {

 $scope.toPage2 = function () {

  $state.go('page2', {phone:$scope.num});
 }; 
});

3、通过$staeParams获得参数phone

myRouterApp.controller('userDetailsController',function($scope,$stateParams){

    console.log($stateParams.phone);

});

如果要传递多个参数，则用对象的形式传递

（1）在app.js中定义路由信息,并在接收的页面（即page2.html）定义接收参数。

.state('page1', { 

 url: '/page1', 

 templateUrl: 'templates/page1.html', 

 controller: 'pageOneCtrl' 

}) 

.state('page2', { 

 url: '/page2',

 templateUrl: 'templates/page2.html',

 controller: 'pageTwoCtrl' ,

 params:{args:{}}

})

（2）在page1中定义点击事件。

html中：

ng-click=“toPage2(name,number)”

控制器中：

.controller('pageOneCtrl', function ($scope, $state) {

 $scope.toPage2 = function (name,number) { 

 $state.go('page2', {

 args:{

  NAME:name,

  NUMBER:number

  }); 

 }; 

});

(3)在Page2中通过$staeParams获得参数ID。

.controller('pageTwoCtrl’, function ($scope, $state, $stateParams) {

   var receivedName = $stateParams.args.NAME;

   var receivedNumber = $stateParams.args.NUMBER;

});

巴特西

angularjs不同页面间参数的传递

最新文章

热门文章