如果数组中没有项,我使用的API将返回此值
items: []
字符串
如果数组中有元素,则返回如下内容
items: [
{
name: 'Bla'
}
]
型
在我的模板中,我相信我需要使用ng-if来根据其中是否有数据来显示/隐藏元素。
<p ng-if="post.capabilities.items"><strong>Topics</strong>: <span ng-repeat="topic in post.capabilities.items">{{topic.name}}</p>
型
然而,我可能完全偏离了基础,因为这是我第一次在Angular工作,可能有一个更好的方法来做我想做的事情。
5条答案
按热度按时间nom7f22z1#
post.capabilities.items
仍然会被定义,因为它是一个空数组,如果你检查post.capabilities.items.length
,它应该工作正常,因为0
是假的。webghufk2#
验证数组的
length
属性是否大于0
:字符串
JavaScript中的数组(对象)是truthy值,因此初始验证
<p ng-if="post.capabilities.items">
的计算结果始终为true
,即使数组为空。6ju8rftf3#
要解决
null
/undefined
问题,请尝试使用?
运算符检查是否存在:字符串
*ngIf
:型
f3temu5u4#
字符串
检查post.capabilities.items的长度是否大于零,并确保数组中的第一个项目不是空字符串。这确保了只有当有可用的post.capabilities.items并且列表中的第一个项目不是空字符串时才显示内容。
5t7ly7z55#
根据我的经验,在HTML模板上做这件事被证明是困难的,所以我决定使用一个事件来调用TS上的一个函数,然后检查条件。
字符串
HTML
型