Angular2 *ngIf 检查模板中的对象数组长度 [英] Angular2 *ngIf check object array length in template
问题描述
参考https://angular.io/docs/ts/latest/guide/displaying-data.html 和堆栈 如何使用 *ngIf 检查 angular 2 模板中的空对象,但仍然收到未定义的语法错误自身上下文.如果我删除 *ngIf 条件,那么我将在 teamMembers 中获取值,如果我将一些值放入其中以便我可以访问 teamMembers 中的值.
我的 teamMember
对象是 [ ] 数组
我正在尝试检查条件数组的大小是否为空.
尝试:
和
0">//检查长度大于抛出语法错误<div class="col-md-12"><h4>团队成员</h4><ul class="avatar" *ngFor="let member of teamMembers"><li><a href=""><gravatar-image [size]="80" [email]="member.email"></gravatar-image></a></li>
组件:
@Component({选择器:'pbi-editor',})导出类 AppComponent 实现 OnInit {团队成员:用户[];
任何帮助都会很棒.
0">这首先检查 teamMembers
是否有值,如果 teamMembers
没有值,它不会尝试访问 length
undefined
因为条件的第一部分已经失败.
Refered to https://angular.io/docs/ts/latest/guide/displaying-data.html and stack How to check empty object in angular 2 template using *ngIf still getting syntax error self context undefined. If I remove *ngIf condition then I am getting values in teamMembers if I push some value into it so I can access values in teamMembers.
my teamMember
object is [ ] array
i am trying to check condition array is empty by size.
Tries :
<div class="row" *ngIf="(teamMembers | json) != '{}'">
and
<div class="row" *ngIf="teamMembers.length > 0"> //Check length great than
throwing syntax error
<div class="col-md-12">
<h4>Team Members</h4>
<ul class="avatar" *ngFor="let member of teamMembers">
<li><a href=""><gravatar-image [size]="80" [email]="member.email"></gravatar-image></a></li>
</ul>
</div>
</div>
Component :
@Component({
selector: 'pbi-editor',
})
export class AppComponent implements OnInit {
teamMembers: User[];
Any help would be great.
解决方案
<div class="row" *ngIf="teamMembers?.length > 0">
This checks first if teamMembers
has a value and if teamMembers
doesn't have a value, it doesn't try to access length
of undefined
because the first part of the condition already fails.
这篇关于Angular2 *ngIf 检查模板中的对象数组长度的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文