javascript - AngularJS - 1 个带有 ng-if 语句的指令或两个指令？

Question

关于 Angular JS 性能的简单问题。

我有一个 ng-repeat 列出了大量搜索结果。我使用指令/模板来提取每个搜索项。

使用包装两个指令的 ng-if 语句更好，还是使用一个指令并在其中包含多个 ng-if 语句，并使用表达式或语句更好。

E.G.包装两个指令的 NG-if 语句:

<div ng-repeat>
    <directive-1 ng-if="this"></directive-1>
    <directive-2 ng-if="that"></directive-2>
</div>

或者

<div ng-repeat>
   <directive-1></directive-1>
</div>

在指令 1 中你有......

<img src="1" ng-if="this">
<img src="2" ng-if="that">
<span>{{title || title2}}</span>
etc...

Answer 1

什么是 ng-if？指令 (1) 具有独立作用域 (2)，用于删除或追加 DOM(3)。

这是什么意思？

1. Ng-if 需要时间来初始化。 (不多)

2. Ng-if 创建新的隔离范围。 (不多)

3. Ng-if 使用 DOM 进行操作。 (可能是非常昂贵的操作)

所以，性能的主要问题与 DOM 有关。加速 ng-if 的最佳方法是减少 dom 操作。

此外，尽量避免将 ng-if 与 ng-repeat 一起使用。您当然可以这样做，但要小心。