Parameter transfer problem when Angular page jumps

  • 2021-07-06 10:11:48
  • OfStack

First, you need to have configured your rout, such as:


$stateProvider
.state('firstPage',{
url:'/Page/firstPage',
templateUrl: 'Page/views/firstPage.html',
controller: 'firstPageCtrl'
//dependencies: ['service/vipSeachService']
})
.state('secPage', {           params:{'message':null},
url: '/Page/secPage',
templateUrl: 'Page/views/secPage.html',
controller: 'secPageCtrl'
})

Note the params attribute in the second address information, which is the object you want to accept parameters, defined in the form of key: value

When jumping to a page, both methods can pass parameters, and one method is written directly in html


<a ui-sref="sec-page"> Jump number 2 Page </a>

At this time, the reference follows the page address


<a ui-sref="sec-page ( {message:messageId} ) "> Jump number 2 Page </a>

The second is written in controller


.controller('firstPageCtrl', function($scope, $state) {    
$state.go('secPage'); });

The same parameter is written after the address in the form of an object


.controller('firstPageCtrl', function($scope, $state) {
    $state.go('secPage' , {message:messageId}); 
});

Parameters transferred in the past need to be received in the controller of the target page with $stateParams, and the change method needs to be injected in advance


.controller('secPageCtrl', function($scope, $state,$stateParams) {
    var test=$stateParams.message;
});

Related articles: