Angular中$state.go頁面跳轉(zhuǎn)并傳遞參數(shù)的方法
遇到一個頁面跳轉(zhuǎn)的時候,在跳轉(zhuǎn)后的頁面獲取跳轉(zhuǎn)前頁面的數(shù)據(jù),我想到用一種是localstorage,一種用broadcast和on,然后老大說不用這么麻煩,既然都$state.go了直接帶參數(shù),這次就介紹一下$state.go頁面跳轉(zhuǎn)傳遞參數(shù)。
1.路由頁面(注意這里要在路由上添加一個參數(shù)用于傳遞數(shù)據(jù),不然在頁面跳轉(zhuǎn)的時候會filter)
.state("home.workpiece",{ // 跳轉(zhuǎn)前的頁面 url:"/workpiece", views: { home: { templateUrl: prefix + "project/workpiece.html", controller: "workpieceCtrl" } } }) .state("home.workpieceDetail",{ //跳轉(zhuǎn)后的頁面 url:"/workpieceDetail?workpieceList", views: { home: { templateUrl: prefix + "project/workpiece_detail.html", controller: "workpieceDetailCtrl" } } })
也可以將參數(shù)放在params中
.state("home.workpieceDetail",{ url:"/workpieceDetail", views: { home: { templateUrl: prefix + "project/workpiece_detail.html", controller: "workpieceDetailCtrl" } }, params: {workpieceList:null} })
2.在workpieceCtrl中
3.workpieceDetailCtrl中
這樣就可以將在頁面跳轉(zhuǎn)的時候傳遞數(shù)據(jù)了。希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持!
- 老生常談angularjs中的$state.go
- 詳解在Angularjs中ui-sref和$state.go如何傳遞參數(shù)
- Angular Renderer (渲染器)的具體使用
- 監(jiān)聽angularJs列表數(shù)據(jù)是否渲染完畢的方法示例
- 使用Angular CDK實現(xiàn)一個Service彈出Toast組件功能
- Angular?服務(wù)器端渲染應(yīng)用常見的內(nèi)存泄漏問題小結(jié)
- JS?Angular?服務(wù)器端渲染應(yīng)用設(shè)置渲染超時時間???????
- Angular?服務(wù)器端渲染緩存功能問題
- 使用?Angular?服務(wù)器端渲染?Transfer?State?Service
相關(guān)文章
在 Angular6 中使用 HTTP 請求服務(wù)端數(shù)據(jù)的步驟詳解
本文分步驟給大家介紹了在 Angular6 中使用 HTTP 請求服務(wù)端數(shù)據(jù)的方法,本文給大家介紹的非常詳細(xì),具有一定的參考借鑒價值,需要的朋友可以參考下2018-08-08全面解析Angular中$Apply()及$Digest()的區(qū)別
$apply()和$digest()在AngularJS中是兩個核心概念,但是有時候它們又讓人困惑。這篇文章主要介紹了Angular中$Apply()及$Digest()區(qū)別詳細(xì)說明的相關(guān)資料,需要的朋友可以參考下2016-08-08AngularJS1.X學(xué)習(xí)筆記2-數(shù)據(jù)綁定詳解
本篇文章主要介紹了AngularJS1.X學(xué)習(xí)筆記2-數(shù)據(jù)綁定詳解,具有一定的參考價值,有興趣的可以了解一下。2017-04-04詳解angularJs中自定義directive的數(shù)據(jù)交互
這篇文章主要介紹了詳解angularJs中自定義directive的數(shù)據(jù)交互,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2017-01-01詳解Angular之constructor和ngOnInit差異及適用場景
這篇文章主要介紹了詳解Angular之constructor和ngOnInit差異及適用場景的相關(guān)資料,有興趣的可以了解一下2017-06-06Angularjs實現(xiàn)控制器之間通信方式實例總結(jié)
這篇文章主要介紹了Angularjs實現(xiàn)控制器之間通信方式,結(jié)合實例形式總結(jié)分析了AngularJS控制器常用通信方式及相關(guān)操作注意事項,需要的朋友可以參考下2018-03-03基于AngularJS拖拽插件ngDraggable.js實現(xiàn)拖拽排序功能
ngDraggable.js是一款比較簡單實用的angularJS拖拽插件,借助于封裝好的一些自定義指令,能夠快速的進(jìn)行一些拖拽應(yīng)用開發(fā)。本文先從基本概念入手,給大家介紹的非常詳細(xì),具有一定的參考借鑒價值,需要的朋友參考下吧2019-04-04