有很多人已经问过这个问题,但我已经按照每个答案将其导入到我的app.module.ts文件中,甚至导入到app.spec.ts文件中
这里是html文件:
<p>{{ randomWord }}</p>
<input type="text" [(ngModel)]="enteredValue">
<button (click)="onSubmit()" >Submit</button>
<p>{{ answer }}</p>
这是app.module.ts文件:
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { AppComponent } from './app.component';
import { TestComponent } from './test/test.component';
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { AppComponent } from './app.component';
import { TestComponent } from './test/test.component';
@NgModule({
declarations: [
AppComponent,
TestComponent,
FormsModule
],
imports: [
BrowserModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
导入FormModule而不是声明
declarations: [
AppComponent,
TestComponent,
],
imports: [
BrowserModule,
FormsModule
],
示例演示
https://stackblitz.com/edit/angular-ngmodel-stackovf?file=app/app.component.html
在app.module.ts
文件中添加以下代码解决了我的问题
添加表单导入
import {FormsModule } from '@angular/forms';
然后在@NgModule
的导入部分中添加FormsModule
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
HttpClientModule,
AppRoutingModule,
FormsModule
],
providers: [],
bootstrap: [ AppComponent ]
})