找不到exportas“ngmodel”的指令Angular 12

zz2j4svz  于 2021-09-29  发布在  Java
关注(0)|答案(2)|浏览(306)

我在angular中创建表单验证,但遇到了错误
找不到exportas“ngmodel”的指令。
我的代码:

<form>
  <div class="form-group">
      <label for="firstname">First Name</label>
      <input type="text" id="name" name="name" required minlength="4" 
                     appForbiddenName="bob" ngModel #name="ngModel">

      <div class="alert alert-danger" *ngIf>First name required</div>
  </div>
  <div class="form-group">
      <label for="comment">Comment</label>
      <textarea name="" id="comment" cols="30" rows="10" class="form-control"></textarea>
  </div>
  <button class="btn btn-primary">Submit</button>
</form>


错误:

Error: src/app/app.component.html:6:60 - error NG8003: No directive found with exportAs 'ngModel'.

    6                      appForbiddenName="bob" ngModel #name="ngModel">
                                                                 ~~~~~~~

      src/app/app.component.ts:5:16
        5   templateUrl: './app.component.html',
                         ~~~~~~~~~~~~~~~~~~~~~~

组件appcomponent的模板中发生错误。

roejwanj

roejwanj1#

每当出现此类错误时,请确保已导入 forms module 在主模块中。

import { NgModule }      from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule, ReactiveFormsModule } from '@angular/forms'; // <== add the imports!

import { AppComponent }  from './app.component';

@NgModule({
  imports: [
    BrowserModule,
    FormsModule,                               
    ReactiveFormsModule                       
  ],
  declarations: [
    AppComponent
    // other components here
  ],
  bootstrap: [ AppComponent ]
})
export class AppModule { }

查看此处了解更多详细信息。

6ljaweal

6ljaweal2#

如果您使用angular模板驱动的表单,并且希望使用#name=“ngmodel”,那么您还需要在同一输入中使用[(ngmodel)]=“mymodel”指令,当然,还需要从“@angular/forms”添加导入{formsmodule};在app.module.ts和导入阵列中,您需要添加formsmodule。

相关问题