angular不同页面传参数的问题
发布时间:2020-12-17 09:46:30 所属栏目:安全 来源:网络整理
导读:一. 基于ui-router的页面跳转传参 (1) 在AngularJS的app.js中用ui-router定义路由,比如现在有两个页面,一个页面(producers1.html)放置了多个producers,点击其中一个目标,页面跳转到对应的producer页面,同时将producerId这个参数传过去。 .state('prod
一. 基于ui-router的页面跳转传参 (1) 在AngularJS的app.js中用ui-router定义路由,比如现在有两个页面,一个页面(producers1.html)放置了多个producers,点击其中一个目标,页面跳转到对应的producer页面,同时将producerId这个参数传过去。 .state('producers',{ url: '/producers',templateUrl: 'views/producers1.html',controller: 'ProducersCtrl' }) .state('producer',{ url: '/producer/:producerId',templateUrl: 'views/producer2.html',controller: 'ProducerCtrl' }) (2) 在producers.html中,定义点击事件,比如ng-click="toProducer(producerId)",在Producers1Ctrl中,定义页面跳转函数 (使用ui-router的$state.go接口):
app.controller('Producers1Ctrl',function ($scope,$state) { $scope.toProducer = function (producerId) { $state.go('producer',{producerId: producerId}); }; });(3) 在Producer2Ctrl中,通过ui-router的$stateParams获取参数producerId: app.controller('Producer2Ctrl',$state,$stateParams) { var producerId = $stateParams.params.producerId; //$state,$stateParams要配合使用,都要注入第二个页面的控制器中 }); 二.自定义个myApp.factory('dataService',function(){ }); 然后在controller注入就可以互相传值了,网页的说法,参考而已,未仔细研究。 当然,传值方式还有多种,比如还有$rootScope,sessionStorage等。。 (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |