Angular 在*ngIf中使用函数会运行多次，而不是一次 模板 服务 问题

组件中的函数会多次打印。为什么？这是错的吗？什么是更好的方法

找到此

我用计算机解决了这个问题

成分 html

{{email | json}}-{{user | json}

模板方法几乎总是被多次调用。对于

*ngFor

来说也是如此，它被多次迭代。如果您有执行昂贵调用的内容，那么应该缓存结果并在方法中返回，或者使用ngOnInit检索/计算值并在组件中设置它们

模板代码 现在你们并没有方法（取而代之的是成员），它也并没有滥发“isAdmin:true”，但这并不意味着问题已经解决

您可能对组件的

变更检测感兴趣，并且
当
isAdmin
更改为更新模板（detectChanges）时，实际告诉angular。
模板方法几乎总是被多次调用。对于
*ngFor
来说也是如此，它被多次迭代。如果你有执行昂贵调用的东西，那么你应该缓存结果并在方法中返回，或者使用ngOnInit检索/计算值并在组件中设置它们。我做了你建议我做的同样的事情。
<pre *ngIf="isAdmin()">{{email|json}} - {{user|json}}</pre>

isAdmin() {
    console.log('isAdmin: ', this.bcAuthService.isAdmin());
    return this.bcAuthService.isAdmin();
}

isAdmin() {
    return this.admins.includes(localStorage.getItem("email"));
}

ngOnInit() {
    this.is_admin();
}
is_admin() {
    this.isAdmin = this.bcAuthService.isAdmin();
}

<pre *ngIf="isAdmin">{{email|json}} - {{user|json}}</pre>

<pre *ngIf="isAdmin">{{email|json}} - {{user|json}}</pre>

export class MyComponent implements OnInit {

    isAdmin: boolean;

    ngOnInit() {
        this.isAdmin = this.bcAuthService.isAdmin();
        console.log('isAdmin: ', this.isAdmin);
    }
}