<h1>Example: ngIf</h1>
<p>ngIfは値がfalseと評価された時、対象のDOMをDOMツリーから削除します。ngShow/ngHideはdisplay: noneで隠すだけですがngIfはDOM自体を削除します。</p>
<div ng-app>
  <input type="checkbox" id="deleteNode" ng-model="check">
  <label for="deleteNode">表示 / 非表示</label>
  <p ng-if="check">追加されたDOM</p>
</div>
@import "bourbon";

body {
  padding: 1.5rem;
}
View Compiled

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

  1. //ajax.googleapis.com/ajax/libs/angularjs/1.3.2/angular.min.js