ngModel 不工作(我导入的表单模块)
ngModel is not working (Forms Module I have imported)
我已经导入了forms module
。此外,我已经包含在 imports
部分中,但我仍然遇到错误。它仅突出显示 html 文件中的错误。我无法理解这个问题。
<textarea rows="6" [(ngModel)] ="enteredValue" ></textarea>
<hr>
<button (click)="onAddPost()">Save Post</button>
<p>{{ newPost }}</p>
组件文件:-
import { Component } from "@angular/core";
@Component({
selector : 'app-post-create',
templateUrl: './post-create.component.html'
})
export class PostCreateCompomnet{
newPost ='I am Genius';
onAddPost(){
this.newPost= this.enteredValue; // this is the value of ngModel
}
}
应用模块
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule } from '@angular/forms';
import { AppComponent } from './app.component';
import { PostCreateCompomnet } from './posts/post-create/post-create.component';
@NgModule({
declarations: [
AppComponent,
PostCreateCompomnet
],
imports: [
BrowserModule,
FormsModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
有人可以帮助我理解这个问题吗?我是 Angular
的新手
您需要修改component.ts文件,如下图,
export class PostCreateCompomnet {
newPost = 'I am Genius';
enteredValue: string; // Missing declaration
onAddPost() {
this.newPost = this.enteredValue;
}
}
缺少 enteredValue
的声明。
我已经导入了forms module
。此外,我已经包含在 imports
部分中,但我仍然遇到错误。它仅突出显示 html 文件中的错误。我无法理解这个问题。
<textarea rows="6" [(ngModel)] ="enteredValue" ></textarea>
<hr>
<button (click)="onAddPost()">Save Post</button>
<p>{{ newPost }}</p>
组件文件:-
import { Component } from "@angular/core";
@Component({
selector : 'app-post-create',
templateUrl: './post-create.component.html'
})
export class PostCreateCompomnet{
newPost ='I am Genius';
onAddPost(){
this.newPost= this.enteredValue; // this is the value of ngModel
}
}
应用模块
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule } from '@angular/forms';
import { AppComponent } from './app.component';
import { PostCreateCompomnet } from './posts/post-create/post-create.component';
@NgModule({
declarations: [
AppComponent,
PostCreateCompomnet
],
imports: [
BrowserModule,
FormsModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
有人可以帮助我理解这个问题吗?我是 Angular
您需要修改component.ts文件,如下图,
export class PostCreateCompomnet {
newPost = 'I am Genius';
enteredValue: string; // Missing declaration
onAddPost() {
this.newPost = this.enteredValue;
}
}
缺少 enteredValue
的声明。