Angular Form

半途入门 Angular，发现 Form 还是有点复杂的，记录下。

基本使用

交叉验证

交叉验证
一个表单里有个两组控件，一组一个输入框，一组两个输入框，两组输入框都是必填的，但是两组输入框只要填一组就可以了，这时候就需要交叉验证了。
一开始用的 onblur 和 onChange 其实也能实现，只是感觉不太优雅。提交了代码后想着问问 copilot，结果很快有不错的方式，但是表单初始化的时候，会直接触发验证，导致一开始就有错误提示。

初始化表单触发验证
在自己实现的一个验证方法里放 touched 和 dirty 的判断，但是这样的话，第一次点击表单的时候不会触发，必须是输入框用户输入东西，或者点击其他有验证的输入框才会触发。这点 Ai 也不好使，试了方法都不行。最后祭出搜索引擎，找到了angular 中关于表单动态验证的一种新思路 - 河北工业大学梦云智软件开发团队 - SegmentFault 思否 引导到 Angular - 验证表单输入 解决了问题。

解决方法
把 touched 和 dirty 的判断放到模板里，这样就可以了。还不知道原理，此处先记录下。

<div *ngIf="heroForm.errors?.['identityRevealed'] && (heroForm.touched || heroForm.dirty)" class="cross-validation-error-message alert alert-danger">
    Name cannot match alter ego.
</div>

参考

Angular - 验证表单输入