詳解在Angularjs中ui-sref和$state.go如何傳遞參數(shù)

更新時間：2017年04月24日 14:21:18 作者：Jager

這篇文章主要介紹了詳解在Angularjs中ui-sref和$state.go如何傳遞參數(shù)，詳細的介紹了ui-sref和$state.go的區(qū)別和如何傳參，有興趣的可以了解下

1 ui-sref、$state.go 的區(qū)別

ui-sref 一般使用在 <a>...</a>；

<a ui-sref="message-list">消息中心</a>

$state.go('someState')一般使用在 controller里面；

.controller('firstCtrl', function($scope, $state) {
   $state.go('login');
 });

這兩個本質(zhì)上是一樣的東西，我們看ui-sref的源碼：

...
element.bind("click", function(e) {
  var button = e.which || e.button;
  if ( !(button > 1 || e.ctrlKey || e.metaKey || e.shiftKey || element.attr('target')) ) {

   var transition = $timeout(function() {
    // HERE we call $state.go inside of ui-sref
    $state.go(ref.state, params, options);
   });

ui-sref最后調(diào)用的還是$state.go()方法

2 如何傳遞參數(shù)

首先，要在目標頁面定義接受的參數(shù)：

傳參，

ui-sref:

$state.go:

接收參數(shù)，

在目標頁面的controller里注入$stateParams，然后 "$stateParams.參數(shù)名" 獲取

以上就是本文的全部內(nèi)容，希望對大家的學習有所幫助，也希望大家多多支持腳本之家。

您可能感興趣的文章:

Angular 4.x+Ionic3踩坑之Ionic3.x pop反向傳值詳解
這篇文章主要給大家介紹了關于Angular 4.x+Ionic3踩坑之Ionic3.x pop反向傳值的相關資料，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧。
2018-03-03
詳解Angular2 之結構型指令
本篇文章主要介紹了詳解Angular2 之結構型指令，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
2017-06-06
整理AngularJS中的一些常用指令
這篇文章主要介紹了整理AngularJS中的一些常用指令,包括ng-app、ng-init、ng-model和ng-repeat這四個指令的講解,需要的朋友可以參考下
2015-06-06
angular6 填坑之sdk的方法
這篇文章主要介紹了angular6 填坑之sdk的方法，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
2018-12-12
AngularJS使用angular-formly進行表單驗證
這篇文章主要介紹了AngularJS使用angular-formly進行表單驗證的相關資料,需要的朋友可以參考下
2015-12-12
AngularJS 模型詳細介紹及實例代碼
本文主要介紹 AngularJS模型，這里詳細介紹了AngularJS 模型中的知識點,并提供實例代碼,有需要的小伙伴可以參考下
2016-07-07
angular+bootstrap的雙向數(shù)據(jù)綁定實例
本篇文章主要介紹angular+bootstrap的雙向數(shù)據(jù)綁定的實例，具有很好的參考價值。下面跟著小編一起來看下吧
2017-03-03
AngularJS學習筆記（三）數(shù)據(jù)雙向綁定的簡單實例
這篇文章主要介紹了AngularJS學習筆記（三）數(shù)據(jù)雙向綁定的簡單實例，詳解數(shù)據(jù)雙向綁定實例的相關資料,需要的朋友可以參考下。
2016-11-11
AngularJS使用ng-options指令實現(xiàn)下拉框
這篇文章主要介紹了AngularJS使用ng-options指令實現(xiàn)下拉框效果，ng-option指令使用也很簡單，下文具體給大家說明，對angularjs 下拉框知識感興趣的朋友一起看下吧
2016-08-08
掌握Queries設計模式優(yōu)化Angular應用開發(fā)技巧
這篇文章主要介紹了掌握Queries設計模式優(yōu)化Angular應用開發(fā)的技巧示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪
2023-10-10