序言
此次次要通过学习老师所写代码,更加深刻的学习教程的常识。
一、自定义控制器的了解
1.registerOnChange
咱们能够学习到:在子组件的value值产生扭转时,能够通过this.xxx.valueChange来监听子组件input的value的变动,由此弹射数据,使父组件产生扭转:
其中fn是弹射的办法,作用是扭转父组件formControl的值。
2.writeValue
该办法次要是负责初始化子组件formControl的value,接管父组件的初始化的值,赋值给子组件
3.registerOnTouched
在教程中咱们并没有遇到其应用,然而在我的项目中咱们遇到了问题:咱们想要在子组件formControl设置为touched之后,将父组件的formControl也设置为touched:
解决:
本人的解决思路:
还是应用this.xxx.valueChange来进行touched的监听,最初始终没有成果,便看了老师的代码:
老师的办法:
viewChild,个别用作组件注入等,在这里能够将图中的整体认为一个选择器,检测与该选择器对应的元素属性是否产生扭转,如果扭转,将执行下图:
在该办法中:获取了textArea这个元素并监听了其blur属性,如果有扭转,则执行this.onTouchedFn:
而this.onTouchedFn便是fn,将父组件的formControl的touched的值设置为true。
过程中遇到的问题:
通过在控制台中打印发现:三者均执行在初始化的时候,而我之前的了解是registerOnChange和resigterOnTouched均执行在value产生扭转和点击的时候执行。
产生该误区的起因是在value产生扭转的时候便会执行resigterOnChange的fn办法,把数据监听的功绩算到了resigterOnChange头上,然而真正的功绩应该是this.xxx.valueChanges的。因为在初始化的时候执行过resigterOnChange办法,使其被valueChanges监听了。