Question

我有一个用于创建新实体的表单，如下所示：

await _client.GetAsync(string.Format(FooRoute, fooId));

我没有在输入中使用ngModel，因为它在出现时应该为空白，并且我正在将createAppForm.value提交给ngSubmit。但是，每当我检查表单的有效属性时：

<form #createAppForm="ngForm"
        (ngSubmit)="createApplication(createAppForm.value)"
        autocomplete="false" novalidate>
    <div class="form-group"
         [ngClass]="{'error': createAppForm.controls.applicationName?.invalid && createAppForm.controls.applicationName?.touched}">
    <label for="applicationName">Application Name</label>
    <em *ngIf="createAppForm.controls.applicationName?.invalid && createAppForm.controls.applicationName?.touched">Required</em>
    <input name="applicationName" required id="applicationName" type="text"
           class="form-control" placeholder="Name of application..." />
    </div>

即使我在输入字段中单击并单击而没有填写任何内容，也总是返回false。作为必填字段，它是否不应该返回true？

我曾经使用过类似的形式来编辑数据，在那儿我使用了[ngModel]并且效果很好，可以验证必填字段。这里也需要[ngModel]，为什么？当我传递表单的值时。

Answer 1

您需要在输入中添加ngModel才能使用Angular的表单验证。

简而言之，ngForm仅检查具有ngModel和名称的元素。没有这些，Angular将无法验证。

将其更改为此：

<input name="applicationName" ngModel required id="applicationName" type="text" class="form-control" placeholder="Name of application..." />

More info on the official docs.

Answer 2

您创建了一个formcontrol，您必须在该表单控件中放置所有验证。

角度输入必填字段不起作用

2 个答案: