角度2檢查組件上的型號是否變化

首先，我的代碼正在工作。這個問題是關於如果我正在做正確的事情，如果我正在使用角2的力量。我來自角1，仍然在學習角2的核心概念。角度2檢查組件上的型號是否變化

讓我們開始：

鑑於角2的應用程序（RC.4）我有呈現日曆作爲視圖日曆組件。根據API休息呼叫的結果，每個日曆的日期都是「裝飾」RED（忙）或GREEN（免費）。如果某一天沒有數據，那麼這一天根本就沒有裝飾。

所以，我在日曆的@component中有以下Observable。一旦解決問題，組件「條目」的屬性就會填充響應。（響應是屬性爲「dayStatus」的day對象的數組設置爲繁忙/綠色）。

ngOnInit() { 
     this.calendarService.getAll().subscribe(
      response => { 
       this.entries = response.json(); 
      } 
     ); 
    }

日曆模板具有ngClass解析爲decorateDay（）處理：

<span class="day" *ngFor="let day of week.days" 
     [ngClass]="decorateDay(day)"> 
     {{ day.number }} 
</span>

每「日」，因此，在一個聲明的方式看起來是否應該裝飾通過綠色或紅色處理程序decorateDay（日）。它的工作原理如下：「day」作爲參數傳遞，並用作從JSON數組中檢索相關對象的鍵。從對象屬性中，一個綠色/紅色字符串被傳遞給視圖，並由CSS使用ngClass進行裝飾。

decorateDay(day) { 

     let dayFormatted = day.date.format("YYYY-MM-DD"); 

     //when observable was resolved entries is not undefined. 
     if (typeof this.entries !== 'undefined') { 
      let data = this.entries[dayFormatted]; 
      if (typeof data !== 'undefined') { 
       return data.dayStatus; 
      } 
     } 
    }

在這裏，我的問題是：我不知道什麼時候「條目」將被定義所以我在處理程序檢查，如果不確定的。看起來像條目填充組件魔術再次檢查處理程序（通過更改檢測）。我對那個沒問題，但是，有沒有更好的方法來檢查組件的屬性何時發生了變化？也許用@resolved或使用生命週期鉤裝飾屬性..？我不喜歡我這樣做的方式！

希望你們中的一些人能給點建議。提前致謝！

PS：與模型屬性的綁定可以在模板本身完成，但我想使用處理程序，因爲它給了我更多的關於如何裝飾未來給定日的靈活性。

來源

2016-07-07 Vicens Fayos

-1

我可能會誤解你的問題，但這在我看來就是你要找的。

ngOnInit() { 
    this.calendarService.getAll().subscribe(
     response => { 
      this.entries = response.json(); 
      // >>> here you know that `entries` was updated 
      // just invoke what you want to be executed when `entries` has changed 
     } 
    ); 
}

來源

2016-07-07 10:25:13

Hi @Günter您沒有誤解這個問題。當然，我想到了這一點。我看到的問題是，我無法將處理程序decorateDay（）從訂閱clousure內部綁定到視圖，對嗎？......另一方面，我不希望將所有邏輯放入subscribe函數中。例如，在角1中，我將在完成一個承諾後播放一個事件，並在其他任何地方使用控制器方法來監聽事件並啓動過程以裝飾視圖...也許我太複雜了自己^^無論如何感謝您的提示！ –

不知道你是什麼意思的綁定，但對於其餘的，只需使用observables。有關如何使用它們，請參閱https://angular.io/docs/ts/latest/cookbook/component-communication.html。 –

角度2檢查組件上的型號是否變化

回答

相關問題