В моем проекте angular (версия 9) у меня есть компонент, который представляет модальное диалоговое окно. В шаблоне компонента есть следующая строка кода, которая отвечает за представление заголовка диалога.
<p mat-dialog-title>{{ generateDialogTitle() }}</p>
В файле машинописи компонента есть метод generateDialogTitle():string, который возвращает сгенерированный заголовок диалога (это зависит от данных диалога).
Модальный диалог вызывается с помощью кода, и этот код вызывается один раз, когда я нажимаю на кнопку.
var dialogRef = this.dialog.open(QuestionDetailsComponent, dialogConfig);
dialogRef.afterClosed().subscribe(result => {
if (result) {
// if dialog has been accepted
... some code here
}
});
Что странно, при отображении В модальном диалоге метод generateDialogTitle() вызывается несколько раз, когда он используется в шаблоне компонента (это единственное место, где он используется).
Как-то неявно вызывается несколько раз, и я не понимаю, почему.
Я заметил это в консоли после отладки.
Затем я удалил привязку к методу generateDialogTitle() из шаблона добавили новое свойство dialogTitle в класс, и заголовок диалога выглядел так:
<p mat-dialog-title>{{ dialogTitle }}</p>
Я отметил generateDialogTitle() как закрытый метод и вызвал его явно в конструкторе, чтобы назначить его значение dialogTitle свойство.
И в этом случае он вызывается только один раз.
Я не понимаю, почему этот метод, когда он используется непосредственно в html -шаблоне, используется вызывается (неявно) несколько раз. Почему это происходит? Это нормальное поведение?