Nas instruções nativas do Angular, essas instruções são usadas para controlar se os elementos são exibidos ou não, ng-show/ng-hide/ng-if e ng-switch.
Também costumamos usá -lo na otimização angular do desempenho.
Vejamos suas diferenças.
Entre eles, Ng-Show e Ng-Hide são os mesmos, exceto que o NG-Show exibe as condições quando se encontram, e Ng Hide oculta as condições quando se encontram. Não mencionaremos Ng-Hide abaixo.
ng-show
Um valor BOOL recebido pelo NG-SHOW será acionado para exibir o nó DOM quando true. Quando o valor do NG-SHOW é falso, uma classe de NG-Hide é adicionada ao nó DOM e a expressão dessa classe é "Display: Nenhum". Quando o DOM carrega, todos os nós no NG-SHOW serão carregados. Ou seja, o NG-Show apenas esconde e exibe o nó DOM. Isso significa que, se houver muito óleo nas instruções do NG-Show, mesmo que não o exibirem, o nó DOM em que eles estão ainda serão renderizados.
ng-if
NG-IF também recebe um valor BOOL. Quando seu valor é falso, o nó que ele controla não é criado ou o nó DOM anterior será destruído. Mesmo que esse nó contenha muitas ligações ng, ele não será executado. Portanto, no desenvolvimento do projeto, se não precisarmos carregar o DOM de uma só vez, podemos usar o NG-IF para impedir que o evento NG aconteça, acelerando assim a velocidade de carregamento do DOM. Especialmente quando se repetem, o efeito é particularmente óbvio quando cada peça de dados contém estruturas de dados complexas. Quando seu valor for verdadeiro, um nó DOM será criado.
Portanto, se você usar instruções e modelos para renderizar informações adicionais, como clicar para exibir as informações detalhadas do item da lista, use NG-IF (AngularJSV. 1.1.5 e posterior). Ele bloqueia a renderização (em comparação com o NG-SHOW).
ng-switch
A existência de ng-switch nos salva muitos problemas (deve-se dizer que o próprio Angular é assim). Por exemplo, usamos a maneira tradicional de criar uma guia de guia. Precisamos fazer um loop de novo e de novo e depois julgar o estado atual e, em seguida, executar as coisas correspondentes. Usar ng-switch no angular é muito simples. O ng-switch deve primeiro ouvir uma determinada variável e qual conteúdo será exibido abaixo quando a variável for avaliada. Como mostrado acima, ao ouvir uma variável como tipo, quando o valor do tipo é igual a 'AAA', esta área será criada e exibida; Quando o valor do tipo for igual a 'BBB', todos os doms do 'AAA' anterior serão destruídos e, em seguida, todos os 'bbb'doms serão criados e exibidos.
Exemplo http://jsbin.com/hinehi/1/edit