如何在ng-if评估之前阻止Angular渲染和显示页面？

Question

我在下面编写了一个代码，该代码基本上显示了基于“ ng-if”评估（真/假）的代码块。 我有一个问题，就是即使vm.anyItems等于true，AngularJS也会尝试渲染<p>...</p>块，并在<div>...</div>之前在浏览器中显示它正确显示。 有什么方法可以防止这种情况发生？

<div ng-if="vm.anyItems">
    <div>...</div>
</div>
<div ng-if="!vm.anyItems">
    <p>XXXXXXXXXXXXX</p>
</div>

Answer 1

尝试查看ngCloak。 在Angular渲染应用程序之后，这将停止显示您的代码。

您的代码可以执行以下操作：

<div ng-cloak ng-if="vm.anyItems">
    <div>...</div>
</div>
<div ng-cloak ng-if="!vm.anyItems">
    <p>XXXXXXXXXXXXX</p>
</div>

资料来源： https : //docs.angularjs.org/api/ng/directive/ngCloak