2013-05-21 3 views
78

세 번째 줄에 {{f = ...}} 문을 쓰면 forecast[day.iso]의 내용이 인쇄되지 않도록하려면 어떻게해야합니까?AngularJS : 템플릿 내부에서 변수를 설정하는 방법은 무엇입니까?

모든 반복마다 forecast[day.iso].temperature 등을 사용하지 않는 것이 좋습니다.

<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> 
+2

,하지만 유용한 팁 {= 예상 [day.iso] f를 {; ""}} 사용하는 것입니다 그것은이 것 보기에 아무 것도 인쇄하지 마십시오. –

답변

160

사용 ngInit : http://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> 

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

+27

더 많은 변수를 원하면 세미콜론으로 분리하십시오 '; – bentzy

+0

Tip for the uninitiated ... 템플릿 구조에 따라 변수의 마지막 값만 보여주는 모든 레코드로 끝날 수 있습니다. (제 경우에는 Angular가 이후 다이제스트주기의 대체를 업데이트했습니다. 같은 표현으로)! 이 상황을 극복하기 위해 변수를 반복되는 현재 레코드의 속성으로 지정할 수 있습니다 (유스 케이스에 실용적인 경우). 위의 예제에서, 이것은'ng-init = "day.f = forecast [day.iso]"가 될 것입니다. –

24

그것은 not the best answer하지만 그 또한 옵션 : 여러 표현을 연결할 수 있지만, 단지 마지막 렌더링되기 때문에 ""으로 표현식을 완료하면 변수가 숨겨집니다.

그래서, 당신과 변수 정의 할 수 있습니다 : 그것은 대답하지 않을 수

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

이것이 문서화 된 기능입니까? –

+0

@ 대니얼 F, 찾을 수 없습니다. 난 그냥 [이] (http://stackoverflow.com/questions/16665319/how-to-set-a-variable-inside-of-a-template#comment54563800_16665319) 의견, 아이디어를 테스트하고, 그것을 좋아하고 결정했다. 더 많은 가시성을 갖기 때문에 답을 추가하고 잃기가 더 어렵습니다. – Zanon

+0

@ DanielF, 같은 해결책을 제시하는이 최고 표를 던진 [답] (http://stackoverflow.com/a/28432472/1476885)을 발견했습니다. 또한 문서 링크가 없습니다. – Zanon

관련 문제