Angular2/5表单校验问题？

Question

我想做一个表单校验，这样的时候是可以工作的:

但是加上flag条件之后就会报错:

Cannot read property 'invalid' of undefined
at Object.eval [as updateDirectives] (EditMemberComponent.html:9)

我判断是加上flag条件之后name的属性就不自动生成的原因，可以还不想在component中手动的new FormControl，感觉太麻烦了

请问该如何解决

Answer 1

很久没搞angular了，简单答一下。
你在下面的代码里加了if条件，然后就报错了。原因是name没有invalid属性，angular里ngif条件为true会在浏览器里生成dom元素，false则不生成。只有在页面上有dom了才能使用#name获取到他的元素引用。所以这个地方#name="ngModel"是不存在的。那么他的invalid和dirty属性就是undefined了。你可以写成!flag && name?.invalid这样试试