Angular 标识符';必需的';没有定义'__类型';不包含这样的成员
我需要声明此变量以键入any?这将显示在HTML模板中的可视代码编辑器中 product-form.component.htmlAngular 标识符';必需的';没有定义'__类型';不包含这样的成员,angular,typescript,angularfire2,Angular,Typescript,Angularfire2,我需要声明此变量以键入any?这将显示在HTML模板中的可视代码编辑器中 product-form.component.html <div class="row"> <div class="col-md-6"> <form #form="ngForm" (ngSubmit)="save(form.value)"> <div class="form-group"> <la
<div class="row">
<div class="col-md-6">
<form #form="ngForm" (ngSubmit)="save(form.value)">
<div class="form-group">
<label for="title">Title</label>
<input #title="ngModel" [(ngModel)]="product.title" name="title" id="title" type="text" class="form-control" required>
<div class="alert alert-danger" *ngIf="title.touched && title.invalid">
Title is required.
</div>
</div>
<div class="form-group">
<label for="price">Price</label>
<div class="input-group">
<span class="input-group-addon">$</span>
<input #price="ngModel" ngModel [(ngModel)]="product.price" name="price" id="price" type="number" class="form-control" required [min]="0">
</div>
<div class="alert alert-danger" *ngIf="price.touched && price.invalid">
<div *ngIf="price.errors.required">Price is required.</div>
<div *ngIf="price.errors.min">Price should be 0 or higher.</div>
</div>
</div>
<div class="form-group">
<label for="category">Category</label>
<select #category="ngModel" ngModel [(ngModel)]="product.category" name="category" id="category" class="form-control" required>
<option value=""></option>
<option *ngFor="let category of categories$ | async" [value]="category.key">{{ category.payload.val().name }}</option>
</select>
<div class="alert alert-danger" *ngIf="category.touched && category.invalid">
Category is required.
</div>
</div>
<div class="form-group">
<label for="imageUrl">Image URL</label>
<input #imageUrl="ngModel" ngModel [(ngModel)]="product.imageUrl" name="imageUrl" id="imageUrl" type="text" class="form-control" required url>
<div class="alert alert-danger" *ngIf="imageUrl.touched && imageUrl.invalid">
<div *ngIf="imageUrl.errors.required">Image URL is required.</div>
<div *ngIf="imageUrl.errors.url">Please enter a valid URL.</div>
</div>
</div>
<button class="btn btn-primary">Save</button>
</form>
</div>
<div class="col-md-6">
<div class="card" style="width: 20rem;">
<img class="card-img-top" [src]="product.imageUrl" *ngIf="product.imageUrl">
<div class="card-block">
<h4 class="card-title">{{ product.title }}</h4>
<p class="card-text">{{ product.price | currency: 'USD': symbol }}</p>
</div>
</div>
</div>
</div>
如何删除此错误?应用程序中的功能似乎没有受到影响。据我所知,它可以编译成有效的JS。我可以通过将其声明为“any”来修复这些对象
如果可能的话,我很想学习如何为此设置一个界面。尝试在“价格”之后添加“?”
像这样:
<div *ngIf="price?.errors.required">Price is required.</div>
<div *ngIf="price?.errors.min">Price should be 0 or higher.</div>
价格是必需的。
价格应为0或更高。
angular中有一个bug。如果您这样编写*ngIf,编译器错误将消失:
<div *ngIf="price.errors['required']">
电子邮件是必需的
电子邮件应至少包含{Email.errors['minlength']['requiredLength']}个字符
电子邮件的最大长度应为{Email.errors['maxlength']['requiredLength']}个字符
电子邮件与模式不匹配。
我的VS代码也有同样的问题。我只使用解决了它代码>在条件之前
尝试:
价格是必需的。
价格应为0或更高。
更多信息:您只需在您的房产前面添加问号即可
<label [attr.data-error]="Password.errors!=null?(Password?.errors.Required?'Required
field!':'Minimum 3 Characters Needed'):''">Password</label>
密码
在使用ngFor
访问视图中FormGroup
内的FormArray
控件时,出现类似错误
这个问题的一些答案部分起作用,导致编译错误或项目构建失败。例如:
libraryForm.get('books') //compile error
libraryForm.controls['books'].controls' //build failure
到目前为止,只有以下解决方案适用于我:
libraryForm['controls']['books']['controls']
整体要素:
<div [formGroupName]="i" *ngFor="let book of libraryForm['controls']['books']['controls'];let i = index">
使用hasError()
方法而不是errors
属性为我修复它。
像这样使用它:
<div *ngIf="price.errors['required']">
价格是必需的。
我也遇到了同样的问题,多亏了安东尼奥·塞萨尔·朱尼尔的回答:
只用
!!
<div *ngIf="submitted && f.username.errors">
<p *ngIf="f.username.errors.required">Email is required</p>
<p *ngIf="f.username.errors.email">The mail address is invalid</p>
</div>
!!
需要电子邮件
邮件地址无效
在以前的项目中工作,然后更改为:
<div *ngIf="submitted && !!f.username.errors">
<p *ngIf="!!f.username.errors.required">Email is required</p>
<p *ngIf="!!f.username.errors.email">The mail address is invalid</p>
</div>
需要电子邮件
邮件地址无效
请检查此解决方案(对我来说效果很好)
用户名是必需的!
用户名应至少为{Username.errors['minlength'].requiredLength}个字符!
用户名不能包含空格!
报告中似乎提到了一些问题:
有时,绑定表达式在AOT编译期间会触发类型错误,因此不可能或很难完全指定类型。要消除错误,可以使用$any()cast函数将表达式转换为any类型,如下例所示
所以你可以做:
$any(price.errors)。必选
除了any
之外,我们在任何地方都看不到您尝试过的内容。如果你能创建一个stackblitz来展示这个错误,那也太好了:)对我有用。只是为了让我明白它的作用:在访问属性之前,它会检查对象是否为null吗?@Ram Ghadiyaram是的,当然……我很乐意。。。。。它表示可为null的属性,因为它第一次可能为null,因此您必须以这种方式处理它…..谢谢非常好的回答谢谢,我也有同样的问题!!名称?.errors?.maxlength,其中未定义maxlength显示标识符“maxlength”__类型“”在VS代码中不包含此类成员。在浏览器上运行带有问题的代码后,不会显示任何错误,但maxlength不起作用意味着:p class=“form control feedback text”*ngIf=“name.errors?”.maxlength&(name.dirty | | name.toucted)”>名称不能超过50个字符。当我使用!!然后它的作品是“什么问题是TS还是其他问题”。谢谢你,伙计,你救了我的命!它就像一个符咒!
!!
<div *ngIf="submitted && f.username.errors">
<p *ngIf="f.username.errors.required">Email is required</p>
<p *ngIf="f.username.errors.email">The mail address is invalid</p>
</div>
<div *ngIf="submitted && !!f.username.errors">
<p *ngIf="!!f.username.errors.required">Email is required</p>
<p *ngIf="!!f.username.errors.email">The mail address is invalid</p>
</div>
<div class="alert alert-danger" *ngIf="username.touched && username.invalid">
<div *ngIf="username.errors['required']">Username are required!</div>
<div *ngIf="username.errors['minlength']">Username should be minimum {{ username.errors['minlength'].requiredLength }} characters!</div>
<div *ngIf="username.errors['cannotContainSpace']">Username cannot contains spaces!</div>
</div>