模板中的 {{ call() }} 多次执行方法块？

Question

此处测试方法中的语句被多次调用。为什么会这样？ DOM 是否被 AngularJS2 多次重新创建？

import { Component } from '@angular/core';

@Component({
  selector: 'my-app',
  template: `<div>Method Call {{test()}}</div>>`
})

export class AppComponent { 
    name = 'Angular';
    test() {
       console.log("Test is called");
    }
}

Answer 1

{{test()}} 每次 Angular 运行更改检测时都会进行评估，这可能很频繁。

不鼓励从视图绑定到函数或方法。更喜欢将方法调用的结果分配给属性并改为绑定到此属性。

@Component({
  selector: 'my-app',
  template: `<div>Method Call {{someValue}}</div>>`
})

export class AppComponent { 
    ngOnInit() {
      this.test();
    }
    name = 'Angular';
    test() {
       this.someValue = "Test is called";
    }
}

模板中的 {{ call() }} 多次执行方法块？

{{ call() }} in template executes the method block multiple times?

angular

lifecycle-hook