Одностороннее связывание данных не работает при использовании протокола даты

Question

Я использую объект даты, чтобы отслеживать текущую дату в приложении.

На мой взгляд, у меня есть один способ связывания, как это:

<h3>{{ currentDate | date }}</h3> 

И в компоненте, у меня есть функции, чтобы изменить эту дату, как это:

previousMonth(){ 
    this.currentDate.setMonth(this.currentDate.getMonth() - 1); 
} 

nextMonth(){ 
    this.currentDate.setMonth(this.currentDate.getMonth() + 1); 
} 

Но когда эти функции , значение currentDate не обновляется в представлении.

Я убедился, что объект даты обновляется, а не на вид.

Всякий раз, когда удаляю трубку даты, она работает.

У кого-нибудь есть идеи, как это исправить?

Спасибо!

Answer 1

Значение не обновляется в представлении, потому что трубы в угловых так называемых чистые (или, без гражданства) по умолчанию. Это означает, что вход не будет переоцениваться, если входной объект изменится, но только если он будет заменен.

Из documentation (смотрите раздел чистых и нечистых трубы):

Угловое выполняет чистую трубу только тогда, когда он обнаруживает чистое изменение входного значения . Чистым изменением является либо изменение примитивного ввода значение (String, Number, Boolean, Symbol), либо изменение ссылки на объект (Date, Array, Function, Object).

Попробуйте следующий код вместо:

previousMonth(){ 
    this.currentDate.setMonth(this.currentDate.getMonth() - 1); 
    this.currentDate = new Date(this.currentDate); 
} 

nextMonth(){ 
    this.currentDate.setMonth(this.currentDate.getMonth() + 1); 
    this.currentDate = new Date(this.currentDate); 
}