我无法按规格显示数据。
例如,我有一份可用教师名单,但我想只展示女教师。
考虑以下数据,其中'userInfo'在数组中有10个用户数据。我只想展示女老师。
userInfo = [
{gender: 'Male', Age: 25, name: John, teacherDetail : [...]},
{gender: 'Female, Age: 26, name: Jessie, teacherDetail: [...]},
...
]
我怎样才能做到这一点?我应该使用过滤管吗?
答案 0 :(得分:4)
有几种方法可以实现它:
选项1:过滤组件
数据的调用函数<div *ngFor="let user of getUserInfo()">
show female teacher only
</div>
getUserInfo() {
return this.userInfo.filter(user => user.gender === 'Female');
}
选项2:使用简单的*ngIf
来控制要显示的内容
<div *ngFor="let user of userInfo">
<div *ngIf="user.gender === 'Female'">
show female teacher only
</div>
</div>
选项3:使用在管道上过滤数据的自定义过滤器(变换部分与Option1相同)
<div *ngFor="let user of userInfo | filterOnlyFemale">
show female teacher only
</div>
transform(input: any) {
return this.userInfo.filter(user => user.gender === 'Female');
}