Angular ngIf指令运行时执行原理

269 阅读1分钟

源代码如下:

这里的NgIf是一个Directive实例吗?

重要的属性:

_elseTemplateRef和_elseViewRef为空,意思是template中的ngif没有指定如果条件为false,应该加载什么template或者view.

thenTemplateRef指向的是如果condition为true,应该加载的模板信息。

设置NgIf实例的private属性:

触发ngIf属性的set方法:

在NgIf的_viewContainer里添加ngIf condition为true之后应该显示的view实例:


下图第四行就是创建的embeddedView:

这个formArrayName需要绑定一个字符串类型的变量,类型为FormArrayName.name:

最后运行时生成的属性名称:ng-reflect-name:

更多Jerry的原创文章,尽在:“汪子熙”: