反应式表单 MinLength 验证未显示错误

Question

我ReactiveForms在我的 Angular 应用程序中使用。我想如果用户输入的数字少于 7 个，所以应该在那里显示错误消息，但不幸的是，如果有任何错误或解决方案，它就不起作用，所以请提供给我。谢谢

服务.ts

PhoneNo: ['', [Validators.required, Validators.minLength(7)]],

html

<input class="full-width has-padding has-border" formControlName="PhoneNo" type="tel" placeholder="Mobile *" />
        <img src="../../../../assets/img/required-img.png" class="required-img"
          *ngIf="service.formModel.get('PhoneNo').touched && service.formModel.get('PhoneNo').errors?.required"
          title="This fields is mandatory" data-toggle="tooltip" />
          <label *ngIf="service.formModel.get('PhoneNo').touched && service.formModel.get('PhoneNo').errors?.minLength">Minimum 7 characters required</label>

Answer 1

从 Angular 的角度来看，这是一种误导。在组件内部，您可以通过以下方式设置验证器：

[Validators.minLength(2)]

然后，您会期望以下内容起作用：

errors?.minLength

无论出于何种原因，他们决定对模板内的错误消息使用以下格式：

errors?.minlength

你唯一需要做的就是用 l 替换 L

Answer 2

至少需要 9 个字符

用户错误键为 minlength 而不是 minLength