Question

我今天尝试在angular 10上启动一个新项目，但是每当尝试在任何东西中使用ngModel时我都遇到了这个问题，我知道这个问题已经在stackoverflow上问过并解决了好几次，但是我已经导入了FormsModule甚至ReactivFormsModule，但是错误不断发生

html

<div class="background">
    <h4>Character Selector</h4>
    <label>Character</label>
    <select [(ngModel)]="selectedChar" name="char-selector">
    <option *ngFor="let char of characterList" [value]="char.value">
      {{char.label}}
    </option>
  </select>
    <p> Selected Character: {{selectedChar}} </p>
</div>

modules.ts

@NgModule({
  declarations: [],
  imports: [BrowserModule, FormsModule, CommonModule, ReactiveFormsModule],
  providers: [],
  bootstrap: [AppComponent],
  schemas: [CUSTOM_ELEMENTS_SCHEMA]
})
export class AppModule {}

StackBlitz Sample

编辑：声明AppComponent已解决问题

@NgModule({
   declarations: [AppComponent],
   imports: [BrowserModule, FormsModule, CommonModule, ReactiveFormsModule],
   providers: [],
   bootstrap: [AppComponent],
   schemas: [CUSTOM_ELEMENTS_SCHEMA]
})
export class AppModule {}

Answer 1

尝试一下：在这里，我使用<select>指令与<p>元素和ngModel元素进行两种方式的绑定。

<select [(ngModel)]="selectedChar">
    <option value="">-- Select a Value --</option>
    <option *ngFor="let char of characterList" [(ngValue)]="char.value">{{char.label}}</option>
</select>

<p>Selected Character: {{selectedChar}}</p>

Angular 10-由于它不是'select'的已知属性，因此无法绑定到'ngModel'

1 个答案: