Angular+Ionic使用queryParams實現跳轉頁傳值的方法
更新時間：2020年09月05日 10:45:58 作者：會做夢的辣條魚
這篇文章主要介紹了Angular+Ionic使用queryParams實現跳轉頁傳值的方法，本文給大家介紹的非常詳細，對大家的學習或工作具有一定的參考借鑒價值,需要的朋友可以參考下
最近，在做電商項目，項目中需要實現:點擊編輯按鈕,跳轉頁面完成添加地址，修改地址功能。
使用到angular傳參,簡單做一總結：
1，發(fā)送界面ts
//編輯地址
EditorAddress(item) {
console.log("選中的地址");
console.log(item);
this.router.navigate(['/editor-address'], { queryParams: item })
}
2，接收界面ts
public personName:string=""
public phone:string=""
public areaInfo:string=""
public detailedAddress:string=""
public isDefault:number
ngOnInit() {
//編輯地址
this.activatedRoute.queryParams.subscribe((res) => {
this.personName =res.personName,
this.phone=res.phone,
this.areaInfo=res.areaInfo,
this.detailedAddress=res.detailedAddress,
this.isDefault=res.isDefault//1
//
})
}
3，效果
到此這篇關于Angular+Ionic使用queryParams實現跳轉頁傳值的文章就介紹到這了,更多相關Angular跳轉頁傳值內容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家！
相關文章
這篇文章主要介紹了AngularJS 應用身份認證的技巧總結，具有一定的參考價值，有需要的可以了解一下。2016-11-11
AngularJS實踐之使用ng-repeat中$index的注意點
最近通過客戶的投訴主要到在ng-repeat中使用了$index引發(fā)的一個bug，下面一起來看看這個錯誤是如何引發(fā)的, 以及如何避免這種bug產生,然后說說我們從中得到的經驗和教訓。有需要的朋友們可以參考借鑒，下面來一起看看吧。2016-12-12
這篇文章主要為大家介紹了詳解Monaco?Editor中的Keybinding機制詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2022-09-09
詳解AngularJs中$resource和restfu服務端數據交互
之前小編和大家分享過使用$http同服務器進行通信，但是功能上比較簡單，angularjs還提供了另外一個可選的服務$resource,使用它可以非常方便的同支持restful的服務單進行數據交互。下面來一起看看吧。2016-09-09
AngularJS基礎 ng-keypress 指令簡單示例
本文主要介紹AngularJS ng-keypress 指令,這里幫大家整理了基礎資料,并附是示例代碼,有需要的小伙伴可以參考下2016-08-08
基于datepicker定義自己的angular時間組件的示例
這篇文章主要介紹了基于datepicker定義自己的angular時間組件,小編覺得挺不錯的，現在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-03-03
這篇文章主要介紹了AngularJS刪除路由中的#符號的方法的相關資料,非常不錯，具有參考借鑒價值，需要的朋友可以參考下2016-09-09
在html規(guī)范里面,它定義了非常多的標簽,在這些標簽里面,相同標簽之間的嵌套,不同標簽之間的嵌套,是十分常見,在Angular里面,我們可以通過自定義標簽的方式引用組件,這里的標簽能否像原生的html標簽一樣,來嵌入html標簽,或者嵌套其他組件標簽呢?本文將介紹投影的作用。2021-05-05
這篇文章主要為大家介紹了AngularJs動態(tài)加載模塊和依賴注入，感興趣的小伙伴們可以參考一下2016-01-01
本文主要講解AngularJS Ajax的知識，這里提供詳細資料及代碼示例，幫助學習AngularJS的朋友,有需要的小伙伴可以參考下2016-08-08