何时使用ng-if vs ng-show / ng-hide？

Question

我知道ng-show和ng-hide影响元素上的类集，而ng-if控制元素是否作为DOM的一部分呈现

是否有任何关于选择ng的例子 - 如果超过ng-show / ng-hide，反之亦然？

Answer 1

你已经在你的问题中总结了它。如果要根据条件显示和隐藏DOM，请使用ng-show。这适用于工作流，选项卡，部分等之间的DOM转换。

<div ng-show="vm.tab == 'products'"></div>

如果您只想在条件发生时有条件地呈现DOM，请使用ng-if。这对于您不希望暴露任何超出必要的DOM的权限特别有用。

<button ng-if="vm.data.allowSubmit" ng-click="vm.submit()" />

Answer 2

如果有一些信息您不希望向用户显示任何信息。 即使在DOM编辑inspect element之后，您仍然希望该用户无法看到它，然后使用ng-if，否则请使用ng-show。

ng-show呈现dom，但如果条件为false，则元素display将为invisible。

`ng-if` renders the `dom` only if condition is true

有些情况下你强行使用ng-show ex:考虑您正在使用任何在dom ready上运行的任何元素的jquery插件。如果在ng-if为true时稍后渲染元素，则​​jquery将不起作用。在这种情况下，您需要使用ng-show