小编d_s*_*ack的帖子

似乎在模板中使用 getter 会导致 Angular 更改检测进入循环（getter 被调用数百次）。在阅读了大量关于类似问题的文章后，我似乎无法得到明确的答案。

背景资料：

从可维护性的角度来看，我确实相信在模板中使用 getter 是最干净的方法，但似乎是因为 Angular 在调用它之前无法知道 getter 值是否改变，它只是一直调用它。到目前为止，我发现了三个替代方案：

1. 停止使用 getter，公开所有属性并直接访问它们
2. 将每个 getter 的值存储到组件的公共属性中，并在模板中绑定它而不是 getter
3. 将Angular的changeDetection模式从默认改为onPush

选项 1 似乎有悖于使用 Typescript 类的好处。选项 2 看起来像是不必要的代码重复并降低了可维护性，选项 3 将需要大量重构。

这是一个示例（出于说明目的而简化）

模型：

export class UserModel { 
  private id: string;

get getId() {
    console.log('Getting id');
    return this.id; 
}
set setId(id) {
   this.id = id;
}
constructor() {
}
}

组件.html

<h1>Test</h1>
<p>{{user.getId}}</p>

组件.ts

  import {Component, OnInit} from '@angular/core';
    import {TestModel} from './test.model';
    
    @Component({
      selector: 'app-root',
      templateUrl: './app.component.html',
      styleUrls: ['./app.component.css']
    })
    export …