1

我在中型结果集上遇到了一些性能问题。结果集是一个文档列表,每个文档都有一个小的属性数组(元数据,如创建、修改、标签、所有者名称等),这些属性在用户单击显示/隐藏按钮之前是隐藏的。

在模板中,我使用了很多ng-shows,当我将所有这些注释掉时,性能会显着提高,所以我想知道是否有办法让 Angular 不编译任何这些,不渲染任何ng-repeats 直到用户单击属性显示/隐藏按钮。还是有更惯用的方式来解决这个问题?

更新:实际上,不是当我注释掉ng-shows 时,而是当我注释掉整个 html 块时,似乎访问对象的属性是导致性能下降的原因。为什么?

模板:

 <div class="property" ng-show="property.display && property.value && property.viewable" ng-repeat="property in item.properties()">

     <span class="property-name">{{property.external}}:</span>
     <span class="property-value" ng-show="property.type == 'string' || property.type == 'integer' || property.type == 'float'">
         <span ng-hide="property.edit">{{property.value}}</span>
         <span ng-show="property.edit">
             <input name="{{property.internal}}" id="{{property.internal}}{{item.id()}}" />
             <span class="edit-button"><a ng-click="simpleUpdate(item, property)">save</a></span>
             <span class="edit-button"><a ng-click="editProperty(item, property)">cancel</a></span>
         </span>
            <span class="edit-button" ng-show="property.editable && !property.edit"><a ng-click="editProperty(item, property)">edit</a></span>
     </span>                

     <span class="property-value" ng-show="property.type == 'stringArray'">
         <span ng-hide="property.edit">{{property.value | join:', '}}</span>
         <span ng-show="property.edit">
             <textarea name="{{property.internal}}" id="{{property.internal}}{{item.id()}}" class="keywords" rows="1" cols="80"></textarea>
             <span class="edit-button"><a ng-click="simpleUpdate(item, property)">save</a></span>
             <span class="edit-button"><a ng-click="editProperty(item, property)">cancel</a></span>
         </span>
         <span class="edit-button" ng-show="property.editable && !property.edit"><a ng-click="editProperty(item, property)">edit</a></span>
     </span>

     <div class="clearboth">&nbsp;</div>
 </div>
4

0 回答 0