AngularJS: Wie setze ich eine Variable innerhalb einer Vorlage?


88

Wie kann ich vermeiden, dass die {{f = ...}}Anweisung in der dritten Zeile den Inhalt von druckt forecast[day.iso]?

Ich möchte vermeiden, forecast[day.iso].temperaturefür jede Iteration usw. zu verwenden.

<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
Es ist möglicherweise keine Antwort, aber ein nützlicher Tipp ist die Verwendung von {{f = Forecast [day.iso]; ""}}, da dadurch nichts in der Ansicht gedruckt wird.
Matt Leonowicz

Antworten:


187

Verwenden Sie 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>

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


31
Wenn Sie mehr als eine Variable möchten, trennen Sie diese einfach mit dem Semikolon ';'
Bentzy

Tipp für Uneingeweihte ... Abhängig von Ihrer Vorlagenstruktur können alle Datensätze nur den letzten Wert Ihrer Variablen anzeigen (in meinem Fall hat Angular die Ersetzungen in einem nachfolgenden Digest-Zyklus aktualisiert, da sie alle gebunden sind der gleiche Ausdruck)! Um dieser Situation entgegenzuwirken, können Sie die Variable als Eigenschaft des aktuellen Datensatzes zuweisen, auf dem iteriert wird (sofern dies für Ihren Anwendungsfall sinnvoll ist). Im obigen Beispiel würde dies werdenng-init="day.f = forecast[day.iso]"
John Rix

33

Es ist nicht die beste Antwort , aber es ist auch eine Option: Da Sie mehrere Ausdrücke verketten können, aber nur der letzte gerendert wird, können Sie Ihren Ausdruck mit beenden ""und Ihre Variable wird ausgeblendet.

Sie können die Variable also wie folgt definieren:

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

Ist dies eine dokumentierte Funktion?
Daniel F

@ DanielF, ich konnte nicht finden. Ich habe gerade diesen Kommentar gesehen, die Idee getestet, sie gemocht und beschlossen, sie als Antwort hinzuzufügen, da sie sichtbarer ist und schwerer zu verlieren ist.
Zanon

@ DanielF, habe gerade diese hoch bewertete Antwort gefunden , die die gleiche Lösung vorschlägt. Es ist auch ohne einen Doc-Link.
Zanon

@ DanielF, ich habe meine Antwort aktualisiert. Ich musste eine Frage stellen , um sie besser zu verstehen. Es ist keine Besonderheit. Nur das Verhalten der Verkettung von Ausdrücken.
Zanon

8
Dieser Hack ist besonders nützlich, wenn der Ausdruck an Bereichsänderungen gebunden werden soll, anstatt einmal auf init ausgeführt zu werden.
Ronny
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.