AngularJS: ¿Cómo establecer una variable dentro de una plantilla?


90

¿Cómo puedo evitar que la {{f = ...}}declaración de la tercera línea imprima el contenido de forecast[day.iso]?

Quiero evitar usar forecast[day.iso].temperaturey así sucesivamente para cada iteración.

<div ng-repeat="day in forecast_days">
  {{$index}} - {{day.iso}} - {{day.name}}
  {{f = forecast[day.iso]}}
  Temperature: {{f.temperature}}<br>
  Humidity: {{f.humidity}}<br>
  ...
</div>

3
Puede que no sea una respuesta, pero un consejo útil es usar {{f = Forecast [day.iso]; ""}} ya que no imprimiría nada en la vista.
Matt Leonowicz

Respuestas:


189

Utilice ngInit : https://docs.angularjs.org/api/ng/directive/ngInit

<div ng-repeat="day in forecast_days" ng-init="f = forecast[day.iso]">
  {{$index}} - {{day.iso}} - {{day.name}}
  Temperature: {{f.temperature}}<br>
  Humidity: {{f.humidity}}<br>
  ...
</div>

Ejemplo: http://jsfiddle.net/coma/UV4qF/


31
Si desea más de una variable, simplemente sepárelas con punto y coma ';'
Bentzy

Sugerencia para los no iniciados ... dependiendo de la estructura de su plantilla, puede terminar con todos los registros mostrando solo el último valor de su variable (en mi caso, Angular actualizó las sustituciones en un ciclo de resumen posterior, ya que todos están vinculados a la misma expresión)! Para combatir esta situación, puede asignar la variable como una propiedad del registro actual que se está iterando (si es práctico para su caso de uso). En el ejemplo anterior, esto se convertiría enng-init="day.f = forecast[day.iso]"
John Rix

35

No es la mejor respuesta , pero también es una opción: dado que puede concatenar múltiples expresiones, pero solo se procesa la última, puede terminar su expresión con ""y su variable se ocultará.

Entonces, podría definir la variable con:

{{f = forecast[day.iso]; ""}}

¿Es esta una característica documentada?
Daniel F

@DanielF, no pude encontrar. Acabo de ver este comentario, probé la idea, me gustó y decidí agregar como respuesta ya que tiene más visibilidad y es más difícil de perder.
Zanon

@DanielF, acaba de encontrar esta respuesta altamente votada que propone la misma solución. Tampoco tiene un enlace de documento.
Zanon

@DanielF, he actualizado mi respuesta. Tuve que hacer una pregunta para entenderlo mejor. No es una característica especial. Solo el comportamiento de concatenar expresiones.
Zanon

8
Este truco es especialmente útil cuando desea que la expresión esté vinculada a cambios de alcance, en lugar de ejecutarse una vez en init.
Ronny
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.