Instrução ng-if do AngularJS

Definição e uso

Se o resultado da calculação da expressão for false,ng-if A instrução eliminará o elemento HTML.

Se o resultado da calculação da instrução if for true, a cópia do elemento será adicionada ao DOM.

ng-if A diretiva e ng-hide diferente,ng-hide Oculta a exibição do elemento, onde ng-if A diretiva remove completamente o elemento do DOM.

Exemplo

Desmarque a caixa de seleção para remover parte:

Manter HTML: <input type="checkbox" ng-model="myVar" ng-init="myVar = true">
<div ng-if="myVar">
<h1>Bem-vindo</h1>
<p>Bem-vindo à minha casa.</p>
<hr>
</div>

Experimente você mesmo

Sintaxe

<elemento ng-if="expressão</elemento>

Todos os elementos HTML suportam.

Parâmetros

Parâmetros Descrição
expressão

Se retornar false, a expressão removerá completamente o elemento.

Se retornar true, uma cópia do elemento será inserida.