Enlace único perezoso angular para expresiones


93

AngularJS tiene una nueva característica desde la versión 1.3.0-beta.10: el "enlace perezoso de una sola vez" .

Las expresiones simples pueden tener el prefijo ::, indicando a angular que deje de mirar después de que la expresión se evaluó por primera vez. El ejemplo común que se da es algo como:

<div>{{::user.name}}</div>

¿Existe una sintaxis similar para expresiones como las siguientes?

<div ng-if="user.isSomething && user.isSomethingElse"></div>
<div ng-class="{classNameFoo: user.isSomething}"></div>

Consulte los documentos angulares para obtener una explicación detallada: docs.angularjs.org/guide/expression#one-time-binding
Akshay Gundewar

Respuestas:


160

Si. Puede prefijar todas las expresiones ::, incluso las que están en ngIfo ngClass:

<div ng-if="::(user.isSomething && user.isSomethingElse)"></div>
<div ng-class="::{classNameFoo: user.isSomething}"></div>

En realidad, el código simplemente verifica que los dos primeros caracteres de la expresión sean :para activar el enlace único (y luego los elimina, por lo que los paréntesis ni siquiera son necesarios). Todo lo demás se mantiene igual.


3
Responde a mi pregunta, aunque algunas de las nuevas características no funcionan bien: <div ng-if="::user.isSomething"></div>y <div ng-if="::(!user.isSomething)"></div>ambas renderizan. Funciona sin el "::".
Seldary

@seldary No puedo reproducir el problema. Todas las expresiones con el prefijo ::funcionan bien para mí, como se explica en mi edición. ¿Puedes hacer un violín, si tienes dudas?
Blackhole

7
Al principio, parecía no funcionar para mí también, con ngClass que tenía varias clases definidas. Rápidamente descubrí que el enlace todavía estaba vinculado porque algunas de las variables observadas utilizadas en ngClass aún no estaban definidas (y sabemos que angular esperará a que se defina el valor antes de liberar al observador). Aquí hay un pequeño violín para demostrar este comportamiento jsfiddle.net/2LkyLoop .
Denis Pshenov

1
La sintaxis de @MaxRocket bindonce se agregó en angular 1.3. Por lo tanto, no funcionará en 1.2 o menos
Berty

2
El enlace único de ng-if no parece funcionar. El recuento de observadores es muy alto con o sin ::. Funciona bien para ng-class, pero ng-if no parece obedecer el enlace único para mí (1.5.6). Tenga en cuenta que estoy tratando de vincular unidireccionalmente una propiedad de objeto que proviene de una repetición ng. No estoy seguro si eso hace una diferencia.
AgmLauncher
Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.