我有这个界面item.ts: -
export interface item{
$key?:string;
available?:boolean;
countable?:boolean;
iname?:string;
price?:string;
desc?:string;
image?:string;
}
项目组件item.componenet.ts是: -
import { Component, OnInit } from '@angular/core';
//import { AdditemsService } from '../../services/additems.service';
import { item } from '../../item';
@Component({
selector: 'app-items',
templateUrl: './items.component.html',
styleUrls: ['./items.component.css']
})
export class ItemsComponent implements OnInit {
items:item={
$key :"",
available :true,
countable :true,
iname :"",
price :"",
desc :"",
image :""
};
constructor() { }
ngOnInit() {
}
}
和html表单item.componenet.html是: -
<form novalidate #fo="ngForm" (ngSubmit)="mySubmit(fo)">
<div class="form-group">
<label for="iname">Item Name : </label>
<input type="text" class="form-control" name="iname"
[(ngModel)]="item.iname" #iteminame="ngModel" required minlength="3">
</div>
<div *ngIf="iteminame.errors?.required && iteminame.touched"
class="alert alert-danger"></div>
<div *ngIf="iteminame.errors?.minlength &&
iteminame.touched" class="alert alert-
danger"></div>
<button type="submit" class="btn btn-
success">Submit</button>
</form>
ngModel无法看到界面中创建的iname的主要问题。我在组件中导入了界面,之后我使用ngModel来使这个文本框可以在文本框中添加和验证。
但我总是看到这个错误,无法读取未定义的属性'iname'。
我认为错误就在这一行。
<input type="text" class="form-control" name="iname" [(ngModel)]="item.iname" #iteminame="ngModel" required minlength="3">
任何帮助??
答案 0 :(得分:2)
您有[(ngModel)]="item.iname"
而不是[(ngModel)]="items.iname"
。只是一个错字。没有&#34;项目&#34;你班上的财产,只有&#34;项目&#34;。