HTML5：使用JS / Jquery添加后无法识别属性

Question

好吧，我坚持这个。我在输入中添加了2个属性，但Angular无法识别它们以进行验证。我做错了什么？

这是我的HTML

<input type="text" id="idDOC" class="form-control" [(ngModel)]="person.DOC_PERSON" #kind_doc="ngModel" name="dni_persona"  required>

这是我的组件

document.getElementById("idDOC").setAttribute("maxlenght", "9");
document.getElementById("idDOC").setAttribute("pattern", "^[0-9]{8}$");

这是控制台:(我在输入中输入：'333333333333'）

模式和最大长度都在那里！但在ng-reflect-model之后，Idk发生了什么，一些建议？

提前致谢。

Answer 1

试试这个。

HTML

<input type="text" id="idDOC" class="form-control" [(ngModel)]="person.DOC_PERSON" 
#kind_doc="ngModel" name="dni_persona" [maxlength]="maxLength" [pattern]="inputPattern"  required>

JS

maxLength = 9;
pattern= /^[0-9]{8}$/;

Answer 2

您的代码中存在输入错误

它应该是maxlength而不是maxlenght

document.getElementById("idDOC").setAttribute("maxlength", "9");

为什么要直接访问DOM到setAttribute？。这不是Angular的正确做法。您可以直接在模板中添加它。