離子2：檢測選項卡組件的更改

我有一個應用程序，其中選項卡布局的每個選項卡都與給定客戶端的屬性（即配置文件，財務等）的不同方面有關。當客戶端發生變化時，我希望父組件能夠檢測到它。離子2：檢測選項卡組件的更改

似乎只有通過[rootParams]="foo"傳遞數據到選項卡的輸入，但我不知道如何檢測父母中的foo更改。

ngOnChanges()似乎沒有更新到foo時觸發。我相信我需要使用Observables只是不知道如何實現。

這是我到目前爲止。從索引中選擇一個客戶後，我們移動到標籤組件：

卡組件（ClientGenericPage）

@Component({ 
    templateUrl: 'client-generic.html' 
}) 

export class ClientGenericPage { 
    client:any; 
    constructor(
    public navParams: NavParams) { 

    this.client = navParams.get('client'); 
    this.clientParams = { 
     client: this.client 
    } 
} 

<ion-tabs class="tabs-basic"> 
    <ion-tab tabTitle="Profile" [root]="profilePage" tabIcon="user-o" [rootParams]="clientParams" #profile></ion-tab> 
    <ion-tab tabTitle="Weigh Ins" [root]="weighinsPage" tabIcon="scale-bathroom" [rootParams]="clientParams" #weighins></ion-tab> 
    <ion-tab tabTitle="Finance" [root]="financePage" [tabBadge]="alerts.financial" tabBadgeStyle="danger" tabIcon="attach-money" [rootParams]="clientParams" #finance></ion-tab> 
    <ion-tab tabTitle="Images" [root]="imagePage" [tabBadge]="alerts.images" tabBadgeStyle="danger" tabIcon="fa-image" [rootParams]="clientParams" #images></ion-tab> 
</ion-tabs>

我再使孩子標籤更新。例如在第一個標籤ProfilePage。

export class ClientDetailsPage { 
    constructor(
    public navCtrl: NavController, 
    public navParams: NavParams, 
    private filterObject: FilterObject, 
    public http: Http, 
    public modalController: ModalController, 
    private clientService: ClientService, 
    private app: App 
) { 
    this.client = navParams.get('client'); 

    // Example function where I make an update to client 
    updateForm(fab) { 
    this.clientService.update(this.client, "client", this.token) 
     .subscribe(
     data => { 
      this.client = data 
      this.clientService.handleResponse("Successfully updated the client!") 
     }, 
     err => this.clientService.handleResponse("Ut oh.. couldn't update the client!"), 
     () => fab.close() 
    ) 
    }

如何提醒家長該客戶端已經改變，所以其他選項卡更新呢？

來源

2017-06-02 Jeremy Thomas

好像你正在尋找？ https://angular.io/docs/ts/latest/cookbook/component-communication.html – Alex

換句話說，要在發生變化時發出事件？它似乎是如此重複，我甚至不知道在哪裏聽的事件，因爲父母不是真正的標籤組件 –

嗯，我們基本上沒有任何工作，因爲你沒有提出任何代碼，並只是與評論*我不知道如何檢測foo *中的變化。所以我不能給出更好的答案。但我給出的鏈接顯示您的（其他）選項相當好。作爲旁註，您還可以決定何時發佈更改。 – Alex

我認爲你可以利用這裏的事件功能。您可以觸發這樣

this.events.publish('functionCall:onClick', event);

事件和訂閱`@ Output`在你的目標頁面發佈這樣的事件

this.events.subscribe('functionCall:onClick', eventData => { 
    //do something 
});

來源

2017-06-03 08:51:44 SAJ

離子2：檢測選項卡組件的更改

回答

相關問題