網站搜尋

typescript - Angular 2 如何讓 setter 等待輸入 setter 完成


嗨,我在這方面有個問題。在我的組件中,我有一個像這樣的輸入設置器:

 @Input() set editStatus(status: boolean) {
    this.savedEditStatus = status;
    if (this.savedEditStatus === true && this.getTrigg === true) {

        this.getDataFromFlex("SHOWS_L").then((data: any) => {
            this.getTrigg = false;
            this.lengthDataOptions = data;
        })
    } else {
        this.getTrigg = true;
        this.lengthDataOptions = undefined;
    }

};

我的問題是我收到了兩個值為 true 的編輯狀態,它們幾乎同時到來。所以目前對於這個元件來說,在這種情況下 getDataFromFlex 函數會被呼叫兩次。我不希望第二次被呼叫,所以我認為 getTrigg(boolean) 會是一個解決方法。但它並沒有起作用。所以我需要你們的一點幫助。getTrigg 在元件初始化時預設設為 true。

答案#1

我建議你使用 ngOnChanges 介面來與外部元件進行這種類型的通信。這將確保在該值變更後,你能擁有預期的值來執行所需的操作:

import { Component, OnInit, Input, OnChanges, SimpleChange } from '@angular/core';

@Input() savedEditStatus: boolean; // change to field not getter / setter

ngOnChanges(changes: { [propKey: string]: SimpleChange }) {
    if (changes['savedEditStatus'] && changes['savedEditStatus'].currentValue === true && 
        this.getTrigg === true) {
        this.getDataFromFlex("SHOWS_L").then((data: any) => {
            this.getTrigg = false;
            this.lengthDataOptions = data;
        })
    } else {
        this.getTrigg = true;
        this.lengthDataOptions = undefined;
    }
}