无法绑定到 'ngValue',因为它不是 'option' angular cli 13 的已知 属性
Can't bind to 'ngValue' since it isn't a known property of 'option' angular cli 13
我在用户界面上使用(Iuser)
<app-user [user]="user"></app-user>
<select (change)="onSelectChange($event.target.value)">
<ng-container *ngFor="let user of users">
<ng-container *ngIf="user.age>30">
<option [ngValue]="user">
{{user.name}} {{user.age}}
</option>
</ng-container>
</ng-container>
</select>
它有 2 个错误:
1.
<select (change)="onSelectChange($event.target.value)">(Object is possibly 'null'.ngtsc(2531)
app.component.ts(3, 46): Error occurs in the template of component AppComponent.)
<option [ngValue]="user">(Can't bind to 'ngValue' since it isn't a known property of 'option'.ngtsc(-998002)
app.component.ts(3, 46): Error occurs in the template of component AppComponent.)
这里写mtuser.ts代码
import { Component, Input, OnChanges, OnInit, SimpleChanges } from '@angular/core';
import { IUser } from '../app-interface';
@Component({
selector: 'app-user',
templateUrl: './user.component.html',
styleUrls: ['./user.component.css']
})
export class UserComponent implements OnInit {
private _user!: IUser;
@Input()
set user(user:IUser){
this._user=user;
this.cunter++;
};
public get user() :IUser{
return this._user;
}
cunter:number=0;
constructor() { }
ngOnInit(): void {
console.log(this._user);
}
}
我不知道如何解决这个问题?
为防止错误#1 添加感叹号 (!) 以表明您知道它可能为空。
<select (change)="onSelectChange($event.target.value!)">
为了防止错误#2 遵循@Abru007 的建议:
<option [value]="user">
我在用户界面上使用(Iuser)
<app-user [user]="user"></app-user>
<select (change)="onSelectChange($event.target.value)">
<ng-container *ngFor="let user of users">
<ng-container *ngIf="user.age>30">
<option [ngValue]="user">
{{user.name}} {{user.age}}
</option>
</ng-container>
</ng-container>
</select>
它有 2 个错误:
1.
<select (change)="onSelectChange($event.target.value)">(Object is possibly 'null'.ngtsc(2531)
app.component.ts(3, 46): Error occurs in the template of component AppComponent.)
<option [ngValue]="user">(Can't bind to 'ngValue' since it isn't a known property of 'option'.ngtsc(-998002)
app.component.ts(3, 46): Error occurs in the template of component AppComponent.)
这里写mtuser.ts代码
import { Component, Input, OnChanges, OnInit, SimpleChanges } from '@angular/core';
import { IUser } from '../app-interface';
@Component({
selector: 'app-user',
templateUrl: './user.component.html',
styleUrls: ['./user.component.css']
})
export class UserComponent implements OnInit {
private _user!: IUser;
@Input()
set user(user:IUser){
this._user=user;
this.cunter++;
};
public get user() :IUser{
return this._user;
}
cunter:number=0;
constructor() { }
ngOnInit(): void {
console.log(this._user);
}
}
我不知道如何解决这个问题?
为防止错误#1 添加感叹号 (!) 以表明您知道它可能为空。
<select (change)="onSelectChange($event.target.value!)">
为了防止错误#2 遵循@Abru007 的建议:
<option [value]="user">