我实际上正在处理一个表单,并且正在对每个字段进行验证。但有一个问题。我的 component.html 文件 block 看起来像这样,
<div class="field"style="padding:1%">
<label>Pacs name</label>
<input
name ="name"
type="text"
[(ngModel)]="pacs.name"
formControlName="pacName"
required
pattern="[a-zA-Z][a-zA-Z ]+"
#name="ngModel"
>
</div>
这是我正在处理的领域,但是当我使用#name="ngModel"时,我在浏览器中收到此错误。
没有将“exportAs”设置为“ngModel”的指令
我放置的FormsModule就是各自的module.ts文件。我在 component.ts 文件中各自的导入看起来像这样。
import { Component, OnInit,Directive, forwardRef,
Attribute,OnChanges, SimpleChanges,Input } from '@angular/core';
import { FormsModule, ReactiveFormsModule,NG_VALIDATORS,Validator,
AbstractControl,ValidatorFn } from '@angular/forms';
import { FormBuilder, FormGroup,FormControl, Validators, Form, NgForm} from '@angular/forms';
我认为可能存在版本控制问题,
所以我的版本是, Angular CLI:1.7.0 节点:6.11.4 操作系统:linux x64
有人可以帮忙吗?我不明白确切的问题在哪里。
最佳答案
一方面,您使用响应式 API 将此控件链接到从您的 TS 代码显式创建的模型属性:formControlName="pacName"
。另一方面,您试图从模板驱动的 API 绑定(bind)到从未创建的隐式模型:#name="ngModel"
和 name="name"
.
在模板驱动的 API 中,您可以执行如下操作:
<input type="text" name="username" ngModel #name="ngModel">
只需从您的代码中删除 #name="ngModel"
和 name="name"
。
关于angular - Angular 中没有将 "exportAs"设置为 "ngModel"的指令,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49130718/