ng-if vs ng-show

這些功能在行為上非常相似。區別在於 ng-if 從 DOM 中刪除元素。如果有大部分程式碼無法顯示，那麼 ng-if 就是你要走的路。ng-show 只會隱藏元素，但會保留所有處理程式。

NG-如果

ngIf 指令根據表示式刪除或重新建立 DOM 樹的一部分。如果分配給 ngIf 的表示式求值為 false 值，則從 DOM 中刪除該元素，否則將元素的克隆重新插入 DOM。

NG-秀

ngShow 指令根據提供給 ngShow 屬性的表示式顯示或隱藏給定的 HTML 元素。通過刪除或新增 ng-hide CSS 類到元素上來顯示或隱藏元素。

例

<div ng-repeat="user in userCollection">
  <p ng-if="user.hasTreeLegs">I am special
    <!-- some complicated DOM -->
  </p>
  <p ng-show="user.hasSubscribed">I am aweosme
    <!-- switch this setting on and off -->
  </p>
</div>

結論

這取決於使用型別，但通常一個比另一個更合適（例如，如果 95％的時間不需要元素，請使用 ng-if;如果需要切換 DOM 元素的可見性，請使用 ng-show）。

如有疑問，請使用 ng-if 並測試！

注意 ：ng-if 會建立一個新的隔離範圍，而 ng-show 和 ng-hide 則不會。如果父作用域屬性不能直接訪問，請使用 $parent.property。