angularjs - 如何在相同条件下为 ng-show 减少 AngularJS 中的观察者

Question

在我的 HTML 代码中，一些 div将以相同的条件显示。我将此条件设置为 ng-show每个div .

<div ng-show="sameCondition1">...data1...</div>
...something else...
<div ng-show="sameCondition1">...data2...</div>
...something else...
<div ng-show="sameCondition1">...data3...</div>

AngularJS 将为每个 ng-show 创建 3 个观察者.它会影响性能。在这种情况下，有没有办法减少观察者的数量？

Answer 1

我不确定这是否可行，但如果您使用的是 AngularJS > 1.3.x 和您的 someCondition1一次迭代后不会改变，那么您可以使用 Angular 的取消注册观察者的功能 ::像下面这样:

<div ng-show="::sameCondition1">...data1...</div>
...something else...
<div ng-show="::sameCondition1">...data2...</div>
...something else...
<div ng-show="::sameCondition1">...data3...</div>

阅读更多 One-time binding

更新

由于您的情况会更新，因此我的上述解决方案对您不起作用。但是我有一个更简洁的解决方案，可以使用 CSS 将观察者减少到 1 个。干得好:

<div class="{{sameCondition1 ? '' : 'hide-similar'}}">
    <div class="similar1">...data1...</div>
    ...something else...
    <div class="similar1">...data2...</div>
    ...something else...
    <div class="similar1">...data3...</div>
</div>

现在，定义你的 CSS:

.hide-similar .similar1 {
    display: none;
}