for - ngIf y ngSwitch AngularJS

no provider for ngswitch

Question

¿Cuál es la diferencia práctica entre ngIf y ngSwitch ? Ambas directivas manipulan el DOM, pero ngSwitch es más detallado. ¿Es el caso típico utilizar simplemente ngIf menos que necesite algo realmente grande, en cuyo caso use ngSwitch ?

¿Hay alguna situación en la que ngSwitch y ngIf no sean reemplazos directos? ¿O es su única diferencia práctica la sintaxis?

Answer 1

Puedes pensar en ngIf / ngSwitch de la misma forma que lo haces con if / switch cuando estás codificando. Obviamente hacen casi lo mismo, pero hay casos en que un ngIf es mejor y hay casos en que nfSwitch es mejor.

Answer 2

Una diferencia más sería que ngIf y ngSwitch crean nuevos ámbitos, mientras que ngShow / ngHide no lo hacen.

Answer 3

ngIf es básicamente una versión de ngSwitch con una sola condición. Es diferente de ngShow porque elimina el elemento DOM real en lugar de simplemente ocultarlo. Si está usando un ngSwitch con solo una verificación de condición verídica, entonces creo que ngIf hará lo mismo.

Answer 4

Michele Tilley lo tiene exactamente correcto , creo, particularmente al señalar el contraste con ngShow / ngHide . Hay una diferencia adicional a tener en cuenta: ng-If : ng-If se desconectará y volverá a conectar un elemento en el lugar . Pero ng-Switch tiene un elemento externo que contiene la declaración de la directiva principal y su condición: ng-switch="expression" . El contenido condicional dentro de ese elemento externo se append() -ed como el último elemento secundario del elemento externo, cambiando así su posición relativa a cualquier contenido no condicional dentro del elemento externo.

Y, vea este CodePen para una demostración interactiva de los tres, que muestra las diferencias en la ejecución.

EDITAR: Este comportamiento cambió en Angular 1.2. Los elementos ahora se dejan en su lugar. El Codepen anterior menciona y demuestra esto, proporcionando un enlace a un 1.08 Plunk que lamentablemente se ha borrado ...