web-dev-qa-db-ja.com

フォームのngModelChange angular 6

アップグレード後angular 5 to 6

私は自分のフォームを更新しようとしました:

anguar 5私が持っていた:

 <select [ngModel]="toto" (ngModelChange)="onChange($event)" 

          <option *ngFor="let toto of totos" [ngValue]="toto.id">{{toto.libelle}}</option>

</select>

角度6私が更新しました:

 <select #oldValue="ngModel" [(ngModel)]="toto" (ngModelChange)="onChange(oldValue)" 

          <option *ngFor="let toto of totos" [ngValue]="toto.id">{{toto.libelle}}</option>
</select>

私はこのエラーを受け取りました:

compiler.js:215 Uncaught Error: Template parse errors:
There is no directive with "exportAs" set to "ngModel" (" 

App.component.tsにFormsModuleを取得しました

何を忘れますか?ありがとうございました

3
Viet47

存在する場合、コンポーネントに「toto」という変数名の呼び出しがありますか?OK

1つは、開いている選択タグを適切に閉じる必要があることです。

[(ngModel)]を使用する場合は、forrm要素に名前を設定する必要があります

最初に見逃したのは、selectタグをcloseしないことです。

インポートする必要がある2番目のことFormsModule and ReactiveFormsModule in app.module.ts

HTMLファイル

<select #oldValue="ngModel" [(ngModel)]="toto" (ngModelChange)="onChange(oldValue)">

          <option *ngFor="let toto of totos" [ngValue]="toto.id">{{toto.libelle}}</option>
</select>

App.module.tsファイル内

import { FormsModule, ReactiveFormsModule } from '@angular/forms';

上記の2つのインポートは、以下のようにngModuleタグに含める必要があります

@NgModule({
  imports: [
    FormsModule,
    ReactiveFormsModule 
   ]
})
0
VIKAS KOHLI

追加するのを忘れていると思います> in select。

<select #oldValue="ngModel" [(ngModel)]="toto" (ngModelChange)="onChange(oldValue)">
0
baj9032