无码久久一区二区,亚洲精品蜜桃av

快捷導(dǎo)航

Angular 4.x+Ionic3踩坑之Ionic 3.x界面?zhèn)髦翟斀?/h1>

更新時間：2018年03月13日 09:24:17 作者：前端小智

這篇文章主要給大家介紹了關(guān)于Angular 4.x+Ionic3踩坑之Ionic 3.x界面?zhèn)髦档南嚓P(guān)資料，文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧。

1.Ionic3.x中頁面(組件)之間正向傳值方式？

這里所說的正向傳值指的是如有兩個頁面，我們簡稱頁面A 和頁面B,正向指的是A跳轉(zhuǎn)到B,比如一個商品跳轉(zhuǎn)這個商品的詳情頁面。

正向傳值Ionic3.x主要有2種

標簽上直接跳轉(zhuǎn)
Js跳轉(zhuǎn)

1) 標簽上直接跳轉(zhuǎn)

Ionic3.x對Angular2以上的的路由進一步封裝,路由跳轉(zhuǎn)主要是由模塊 NavController 來完成的,傳遞參數(shù)主要是由模塊 NavParams 來完成的,用法如下

A頁面內(nèi)容:

htmll：代碼

<button [navPush]="bPage" [navParams]="{id:'001'}"></button>

ts:代碼

import { BPage } from '../BPage';
export class APage {
 public bPage:any;
 constructor(public navCtrl: NavController, public navParams: NavParams){
    this.bPage = BPage;
 }
}

注意:這邊自己經(jīng)常遇到一個問題就是我們申明，變量bPage的，可以有的教程就直接賦值，如
public bPage = BPage;我的問題是，我寫這種寫法點擊按鈕跳轉(zhuǎn)不了，所以我的解決的方法是在構(gòu)造函數(shù)里面賦值，這樣就可以解決啦!

那B頁面要怎么獲取呢,看招：

B頁面內(nèi)容:

ts代碼

export class APage {
public bPage:any;
constructor(public navCtrl: NavController, public navParams: NavParams){
  // 獲取A頁面?zhèn)鬟f過來的id
  let id = this.navParams.get('id');
 }
}

獲取相對還是很容易!

2.Js跳轉(zhuǎn)

A頁面內(nèi)容:

htmll：代碼

<buttton (click)="goToBpage()"></button>

ts代碼

import { BPage } from '../BPage';
export class APage {
 constructor(public navCtrl: NavController, public navParams: NavParams){
 }
 // 跳轉(zhuǎn)方法
 goToBpage(){
   this.navCtrl.push(BPage,{'id':'0001'})
 }
}

B頁面獲取同上，這邊js跳轉(zhuǎn)主要是用NavControlller中的push方法，第一個參數(shù)為要跳轉(zhuǎn)的頁面，第二個參數(shù)的就是參數(shù)值，注意這是一個Json格式的對象。

總結(jié)

今天主要分享界面的正向傳值,其實主要歸功了NavController和NavParams這兩個強大的模塊,這兩個還有很多方法，大家要進一步學(xué)習(xí)，可以到官方文檔查看哦。

好了，以上就是這篇文章的全部內(nèi)容了，希望本文的內(nèi)容對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，如果有疑問大家可以留言交流，謝謝大家對腳本之家的支持。

您可能感興趣的文章:

最新国产好看的视频,伊人天堂AV在线,国产Aaaaaa视频,蜜臀视频在线观看一区,人妻av色图,密臀久久久精品影片,青青视频免费观看毛片,久草在线观看视,国产三级精品色情在线

相關(guān)文章

最新評論

大家感興趣的內(nèi)容

最近更新的內(nèi)容

常用在線小工具