Угловое использование функции внутри интерполяции {{function ()}}, что это значит и является ли это хорошей практикой

Question

Что здесь означает использование функции внутри интерполяции строк?

<p>{{trackTotal()}}</p>   

Для любого изменения, даже если ввести некоторое значение во входные данные на той же странице, оно также называется:

trackTotal()

<input type="text" />

Это хорошая практика или плохая практика использовать это таким образом?

Answer 1

Это зависит от того, что делает trackTotal. Поскольку вы не предоставили код для него, трудно сказать.

Как правило, лучше хранить значение в свойстве компонента и вычислять его только тогда, когда это необходимо. Но использование функции тоже неплохо, если она выполняет только небольшие вычисления. Вы также можете использовать конвейер вместо функции.

Если реализация похожа на trackTotal() { return this.data.total }, тогда ее можно использовать. Но лучше создать геттер.

Если у него есть побочные эффекты, то нет.

trackTotal() {
    this.service.startAProcess();
    // or
    return this.total = this.values.reduce((a, b) => a + b);
}

Answer 2

Это плохая практика. Обнаружение изменений в компоненте будет вызывать вызов функции каждый раз.

Чтобы узнать больше об обнаружении изменений, посетите этот блог https://blog.thoughtram.io/angular/2016/02/22/angular-2-change-detection-explained.html#whats-change-detection-anyways