This article is about the simple use of AngularJS ui-sref. I happened to learn it recently, so I posted it to the essay.
Specific usage:
<a ui-sref="man">man</a>
This is a very simple use of ui-sref. When JavaScript regenerates the web page, it will look for the state named "man" in $state, read the url of this state, and then generate href="url" rel="external nofollow" in the a tag,
The result is:<a ui-sref="man" href="#/" rel="external nofollow" >Man</a>
But if, you are creating a navigation controller that has an array of navigation items:
$ = [ {state: "man", statePage: ""}, {state: "womanMe", statePage: ""} ]
Then use repeat in html:
<li repeat="item in items"> <a ui-sref="{{}}"><{{}}</a> </li>
ui-sref does not support dynamic binding, such code will report an error. In sref, you can only use the state name and add at most parameters.
In this way, you can only give up sref and use back to bind. You can use $ to read the url of state.
The following briefly introduces the passing of ui-sref parameters
The page is written as follows
<a ui-sref="man({id:1,name:2})" >Button</a>
Configuration in the route:
$('man', { url: '/?id&name', //The parameters must be declared here first templateUrl: '../', })
After clicking on the connection, the browser's address will change to: //id=1&name=2
Or it can be done
$('man', { url: '/', templateUrl: '../', params: {'id': null,'name':null},//The parameters are declared here })
Then, in the corresponding controller, use $stateParams to get the value: $,$
In fact, ui-sref and $ are essentially the same thing, you can check the ui-sref source code
("click", function(e) { var button = || ; if ( !(button > 1 || || || || ('target')) ) { var transition = $timeout(function() { // HERE we call $ inside of ui-sref $(, params, options); });
The above is all the content of this article. I hope it will be helpful to everyone's study and I hope everyone will support me more.