使用ngIf检查数组长度或显示div的内容

Question

我想根据数据数组的长度来控制是否显示div。如果有数据，请继续显示div，如果没有，则将其隐藏。我正在使用* ngIf，但我想问两种不同的方法，一种方法是否比另一种方法好，也许是为什么。

*ngIf="dataArray?"

要么

*ngIf="dataArray?.length > 0"

Answer 1

要回答您的问题，可以使用第二种方法来完成您要实现的功能：

*ngIf="dataArray?.length > 0"

因为这实际上是在测试数组是否存在并且其长度是否大于零（如Sajeetharan在他的回答中所提到的）。

为了达到相同的结果，还可以通过以下两种不同的方式进行编写：

*ngIf="dataArray?.length"

要么

*ngIf="!!dataArray?.length"

第一种选择使用以下事实：数组长度不能小于0且0为假，而> 0为true。第二种选择将真/假状态显式转换为真或假。

我更喜欢这样写：

*ngIf="dataArray?.length"

在编写JS时，我倾向于编写简洁的代码，并最终在可读性和紧凑性之间做出权衡。这主要是因为JS是解释性语言，而简洁的代码可以提高效率。

我同意有一些可用的简化程序可以为我们做到这一点，但是在某些情况下，它们可能无法像模板表达式那样工作。

移至组件：这是Angular的起点。我会说这真的取决于权衡取舍，没有“是”-“没有答案”。对于我们目前正在开发的大型Angular4应用程序，我们不会将其移动。但是，如果还有其他条件或涉及更多逻辑，我们将其移动并设置一个标志。因此，要回答您的问题，如果您真的想进一步优化它，则可以使用标志代替，并在将元素添加到数组的位置将其设置为true。

这就是我的理解。如果有人要添加或更正，请在评论中写。