只有在设置了属性后才渲染角度指令？

Question

我有一个加载视图，它被设置为指令中的html。如下所示。

<my-directive>
    <div class="loader"></div>
</my-directive>

我希望其中的HTML处于活动状态，直到我的指令的某些属性完成处理。

我发现最接近的是transclude，但我不确定这是不是我想要的。

有没有办法在某个任意时间点之前避免渲染？

Answer 1

你可以隐藏一个html元素，直到一个属性返回true

<div ng-if="taskFinished"></div>

或

<div ng-show="taskFinished"></div>  

两者都做同样的想法，但是使用ng-show隐藏内容不会在每次取消隐藏时重新计算

Answer 2

Alainlb解释的也是我如何处理这个问题，如下例所示：

<my-directive>
    <div ng-if="loading">
        <div class="loader"></div>
    </div>
    <div ng-if="!loading">
        <span>Do everything in here...</span>
    </div>
</my-directive>

ng-if和ng-show / ng-hide

我个人总是使用ng-if，除非有充分的理由不这样做。由于ng-if只会在检查通过后呈现HTML。另一方面，ng-hide会使HTML代码不可见，但它仍然存在！当指令非常复杂时，浏览器就会做无意义的工作来计算和呈现用户甚至看不到的东西。对我来说，唯一有意义的是当你想要折叠你知道用户肯定会经常打开的项目时。即使在这种情况下，我仍然会考虑ng-if，除非每次渲染需要很长时间。