Angular 如何解决使用ngModel的问题
我正在尝试绑定ngModel表单输入文本,但它不起作用,这是我的问题 regi.component.html。 在我的html部分中,我将输入标记与ngModel一起使用Angular 如何解决使用ngModel的问题,angular,Angular,我正在尝试绑定ngModel表单输入文本,但它不起作用,这是我的问题 regi.component.html。 在我的html部分中,我将输入标记与ngModel一起使用,但是这个ngModel不打印我的字符串值 <input id="name" name="name" [(ngModel)]="hero" > 就这样 我只想用html打印我的值 但是当我保存文件时, 此错误显示在终端中 这是我的注册模块 import
,但是这个ngModel不打印我的字符串值
<input id="name" name="name" [(ngModel)]="hero" >
就这样我只想用html打印我的值 但是当我保存文件时,
此错误显示在终端中 这是我的注册模块
import { NgModule } from '@angular/core';
import { FormsModule,ReactiveFormsModule } from '@angular/forms';
import { CommonModule } from '@angular/common';
import { RegiRoutingModule } from "./regi-routing.module";
@NgModule({
declarations: [ ],
imports: [CommonModule,
FormsModule,ReactiveFormsModule,
RegiRoutingModule],
},
)
export class RegiModule { }
当保存并查看vs代码终端时
这是我的项目结构如果要将表单字段与输入绑定,则无需使用NgModel,可以通过以下方式进行设置:
<input id="name" name="name" class="form-control"
required minlength="4" appForbiddenName="bob"
formControlName="name" >
<div *ngIf="name.invalid && (name.dirty || name.touched)"
class="alert alert-danger">
<div *ngIf="name.errors.required">
Name is required.
</div>
<div *ngIf="name.errors.minlength">
Name must be at least 4 characters long.
</div>
<div *ngIf="name.errors.forbiddenName">
Name cannot be Bob.
</div>
</div>
名称是必需的。
名称的长度必须至少为4个字符。
姓名不能是Bob。
此外,您必须在绑定之前创建的表单的formGroup中声明:
<form [formGroup]="heroForm">
// your form info here
</form>
//您的表格信息在这里
尝试在app.module.ts中导入formsModule
import { NgModule } from '@angular/core';
import { FormsModule,ReactiveFormsModule } from '@angular/forms';
import { CommonModule } from '@angular/common';
import { RegiRoutingModule } from "./regi-routing.module";
@NgModule({
declarations: [ ],
imports: [CommonModule,
FormsModule,ReactiveFormsModule,
RegiRoutingModule],
},
)
export class RegiModule { }
你到底想要什么
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { ReactiveFormsModule } from '@angular/forms';
@NgModule({
imports: [
CommonModule,
FormsModule,
ReactiveFormsModule
],
declarations: []
}
)