英文:
Can't bind to 'ngModel' since it isn't a known property of 'input' Angular
问题
以下是翻译好的部分：
我正在创建 Angular 表单设计时，创建过程中出现了错误 **无法绑定到 'ngModel'，因为它不是 'input' 的已知属性**。我不知道为什么，我已经成功导入了 formsmodule，为什么会显示这个错误。我尝试了以下方法，如下所示。
<form>
<div class="form-group">
<label>学生姓名</label>
<input type="text" [(ngModel)]="name" [ngModelOptions]="{standalone: true}" class="form-control" id="name" placeholder="输入姓名">
</div>
<div class="form-group">
<label>学生地址</label>
<input type="text" class="form-control" [(ngModel)]="address" [ngModelOptions]="{standalone: true}" id="address" placeholder="输入地址">
</div>
<div class="form-group">
<label>学生电话</label>
<input type="text" class="form-control" [(ngModel)]="phone" [ngModelOptions]="{standalone: true}" id="phone" placeholder="输入电话">
</div>
<button type="submit" (click)="save()" class="btn btn-primary">提交</button>
</form>
**app.module.ts**
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { HttpClientModule } from '@angular/common/http';
import { ReactiveFormsModule } from '@angular/forms';
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
AppRoutingModule,
ReactiveFormsModule ,
HttpClientModule,
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
英文:
i am creating the angular form design while i creating i got the error was Can't bind to 'ngModel' since it isn't a known property of 'input' . i don't why i have import the formsmodule successfully why show us the error. what i tried so far i attached below.
<form>
<div class="form-group">
<label>Student Name</label>
<input type="text" [(ngModel)]="name" [ngModelOptions]="{standalone: true}" class="form-control" id="name" placeholder="Enter Name" >
</div>
<div class="form-group">
<label>Student Address</label>
<input type="text" class="form-control" [(ngModel)]="address" [ngModelOptions]="{standalone: true}" id="address" placeholder="Enter Address">
</div>
<div class="form-group">
<label>Student Phone</label>
<input type="text" class="form-control" [(ngModel)]="phone" [ngModelOptions]="{standalone: true}" id="phone" placeholder="Enter Phone">
</div>
<button type="submit" (click)="save()" class="btn btn-primary">Submit</button>
</form>
app.module.ts
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { HttpClientModule } from '@angular/common/http';
import { ReactiveFormsModule } from '@angular/forms';
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
AppRoutingModule,
ReactiveFormsModule ,
HttpClientModule,
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
答案1
得分: 1
导入FormsModule也在AppModule文件中
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { HttpClientModule } from '@angular/common/http';
import { ReactiveFormsModule, FormsModule } from '@angular/forms';
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
AppRoutingModule,
ReactiveFormsModule,
FormsModule,
HttpClientModule,
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
英文:
Import FormsModule also in AppModule file
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { HttpClientModule } from '@angular/common/http';
import { ReactiveFormsModule,FormsModule } from '@angular/forms';
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
AppRoutingModule,
ReactiveFormsModule ,
FormsModule,
HttpClientModule,
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论