私はasp.net core/Angularプロジェクトを持っています。私app.module.client.tsファイルで 、私は以下のように '@角度/フォーム' インポートしています:私のコンポーネントは、このように構成されてAngular/NgForm/NgModelディレクティブエラー: "exportAs"が "ngForm"に設定されているディレクティブがありません。
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { sharedConfig } from './app.module.shared';
@NgModule({
bootstrap: sharedConfig.bootstrap,
declarations: sharedConfig.declarations,
imports: [
BrowserModule,
FormsModule,
HttpModule,
...sharedConfig.imports
],
providers: [
{ provide: 'ORIGIN_URL', useValue: location.origin }
]
})
export class AppModule {
}
を:
import { Component } from '@angular/core';
import { NgForm } from '@angular/forms';
import { Operator } from '../shared/operator.model';
@Component({
selector: 'operator-form',
template: require('./operator-form.component.html')
})
export class OperatorFormComponent {
model = new Operator("Login", "Name", "Last name", "password");
submitted = false;
onSubmit() { this.submitted = true; }
// TODO: Remove this when we're done
get diagnostic() { return JSON.stringify(this.model); }
}
マイテンプレートは以下のように構成されています
<form #formOperator="ngForm">
<div class="form-group">
<label for="login">Login</label>
<input type="text" class="form-control" id="login" required [(ngModel)]="model.login" name="login" />
</div>
<div class="form-group">
<label for="firstName">First Name</label>
<input type="text" class="form-control" id="firstName" required [(ngModel)]="model.firstName" name="firstName" />
</div>
<div class="form-group">
<label for="lastName">Last Name</label>
<input type="text" class="form-control" id="lastName" required [(ngModel)]="model.lastName" name="lastName" />
</div>
<div class="form-group">
<label for="password">Password</label>
<input type="text" class="form-control" id="password" required [(ngModel)]="model.password" name="password" />
</div>
<div class="form-group">
<label for="expirationDate">Valid until</label>
<input type="date" class="form-control" id="expirationDate" [(ngModel)]="model.validUntil" name="expirationDate" />
</div>
<button type="submit" class="btn btn-success">Submit</button>
</form>
残念ながら、私はエラーを持っている: "ngForm" に設定された "EXPORTAS"
任意のアイデアとはディレクティブがありませんか?
ありがとうございます!
formsモジュールが正しく適用されなかった場合、 '#formOperator =" ngForm "'を削除するとバインディングは機能しますか? –
@ Maximus私は同意する、それは、フォームモジュールが読み込まれないようです。いいえ、NgFormディレクティブを削除してもバインディングは機能しません。 –