问Angular如何计算表达式？

EN

编译Angular组件时，将为所有绑定以及需要在模板中应用的所有组件、指令和管道生成TypeScript (以及下一步JavaScript中的are )。然后，浏览器就会执行这个JavaScript。

这是与AngularJS的主要区别之一，后者将具有Angular绑定结构的HTML添加到浏览器加载的HTML中，然后Angular解析DOM并应用其逻辑。

在Angular 2和更高版本中，只有在编译组件模板之后，才会将HTML添加到DOM 中。如果您在浏览器devtools中检查HTML，则缺少特定于Angular的绑定(如果包含一些非Angular DOM语义，则替换它们)

对于静态模块，当开发人员编译Angular应用程序时(在部署之前)，就会发生这种情况。使用动态模块，组件编译也可以在运行时进行。但它仍然是一样的。只有在 Angular为模板生成JS代码并替换/删除特定于Angular的绑定语法之后，才会将模板添加到DOM 中。

首先：

*ngIf指令基本上是“用<ng-template [ngIf]>环绕”的快捷方式

 <div *ngIf="expr"></div>


 <ng-template [ngIf]="expr">
   <div></div>
 </ng-template>

因此，基本上它可以归结为与输入绑定相同的计算。您可以在此处搜索信息：

https://github.com/angular/angular/blob/master/aio/content/guide/template-syntax.md

请注意，当Angular运行更改检测时，它将检查是否有任何变量发生了更改，如果是，则重新评估组件是否要显示/实例化。