angular view,angular field of view

　　本文带你了解Angular中的@ViewChild，并介绍如何使用@ViewChild。

　　简单地说

　　我个人对@ViewChild的理解是，它是一个引用，通过它我可以得到这个组件或者元素。并且我们可以使用这个组件获得的值和方法。【相关教程推荐：《angular教程》】

　　为了更直观的知道它是做什么的，直接去看代码就可以了。

通过@ViewChild获取子组件，得到子组件的值、调用子组件的方法

　　子组件

　　内容：‘唐小蓝’；

　　changeChildCon() {

　　this.content=Zita1111

　　}父组件

　　超文本标记语言

　　app-child # children view/app-child

　　分时（同timesharing）

　　从“@angular/core”导入{ view child }；

　　@ViewChild(ChildrenView ，{ static:true })children view:any；//ChildrenView是子组件中#之后的值，ChildrenView是用于引用子组件的名称。

　　this . children view . content//zita获取子组件中的值

　　this . children view . change child con()//执行子组件中的方法

　　this . children view . content//zita 1111

通过@ViewChild获取某个元素

　　 html

　　图#帕贝尔

　　它是我的父元素中的一个标记图，可以通过viewchild获取，获取我之后可以改变样式。

　　/图

　　从“@angular/core”导入{ ViewChild，element ref }；

　　@ViewChild(parBele ，{ static:true })eleRef:element ref；

　　this . eleref . native element . style . color= red ；//更改获取的dom元素的样式。然后，通过这段代码，您将在页面中看到figure标记中的字体颜色变为红色。

　　:角度8.0后的

特别提醒

　　，一定要加上{static: true}此属性。哦，另外，官方对这个属性的解释是：

　　对于static，它意味着：如果为true，则在运行变化检测之前解析查询结果；如果为false，则在检测到更改后解析查询结果。默认情况下为False。

　　怎么理解呢？

　　主要在于动作“变化检测”发生的节点。

　　例如，我们经常使用ngIf和ngShow指令，如果这些指令被添加到子组件并且static为真的话。然后，当我们捕获参考目标时，该值将是未定义的。

　　至此，我对实际项目中经常用到的@ViewChild的理解结束了……在此给大家鼓励一下。

　　更多编程知识请访问：编程教学！以上就是@ViewChild在Angular中的使用细节。请多关注我们的其他相关文章！

郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。