Question

情况：

在我的应用程序中，我有最大数量的部分，12。但并非所有这些都必须每次显示，这取决于包含相关数据的对象是否为空。

在视图中，我检查每个对象，如果对象为空，则不显示相对部分。

就是这样。

问题是这会导致在主视图中显示按钮（链接到每个部分）的显着延迟。在0.5到1秒之间。真的太多了。没有ng-show，按钮会立即显示，但我需要进行检查。

问题：

我可以采取哪些措施让AngularJs更快地进行评估？

我已经尝试了几种方法来进行检查，但延迟仍然相同。

ATTEMPT 1 - 常规功能和ng-show：

使用检查对象是否为空的常规函数：

$scope.isEmpty = function(obj) 
{
    // Return true if empty
    if (obj == null) return true;
    if (obj.length === 0)  return true;

    // Return false if not empty
    if (obj.length > 0)    return false;

    for (var key in obj) 
    {
        if (hasOwnProperty.call(obj, key)) return false;
    }

    return true;
}

观点：

<button class="button" ui-sref="app.section_1" ng-show="!isEmpty(section1_data)">Section 1 </button>

ATTEMPT 2 - 更简单的检查和ng-show：

<button class="button" ui-sref="app.section_1" ng-show="section1_data.length > 0">Section 1 </button>

ATTEMPT 3 - 常规功能和ng-if

<button class="button" ui-sref="app.section_1" ng-if="!isEmpty(section1_data)">Section 1 </button>

ATTEMPT 4 - 简单检查和ng-if

<button class="button" ui-sref="app.section_1" ng-if="section1_data.length > 0">Section 1 </button>

结论：

对于所有这4次尝试，Angular需要评估的时间是相同的。

我真的需要加快这个过程，但我没有想法。有人知道我怎么能实现它？

谢谢！

Answer 1

用ng-if

替换ng-show / ng-hide

AngularJs评估ng-show的速度很慢

1 个答案: