AngularJS: Làm thế nào để đặt một biến bên trong một mẫu?


90

Làm cách nào tôi có thể tránh để {{f = ...}}câu lệnh ở dòng thứ ba in ra nội dung của forecast[day.iso]?

Tôi muốn tránh sử dụng forecast[day.iso].temperature, v.v. cho mỗi lần lặp lại.

<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
Nó có thể không phải là câu trả lời, nhưng mẹo hữu ích là sử dụng {{f =casting [day.iso]; ""}} vì nó sẽ không in bất cứ thứ gì trên chế độ xem.
Matt Leonowicz

Câu trả lời:


189

Sử dụng 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>

Ví dụ: http://jsfiddle.net/coma/UV4qF/


31
Nếu bạn muốn nhiều hơn thì một biến chỉ cần tách chúng bằng dấu chấm phẩy ';'
bentzy

Mẹo cho người chưa khởi tạo ... tùy thuộc vào cấu trúc mẫu của bạn, bạn có thể kết thúc với tất cả các bản ghi chỉ hiển thị giá trị cuối cùng của biến cùng một biểu thức)! Để khắc phục tình trạng này, bạn có thể gán biến làm thuộc tính của bản ghi hiện tại đang được lặp lại (nếu phù hợp với trường hợp sử dụng của bạn). Trong ví dụ trên, điều này sẽ trở thànhng-init="day.f = forecast[day.iso]"
John Rix

35

Đây không phải là câu trả lời hay nhất , nhưng cũng là một tùy chọn: vì bạn có thể nối nhiều biểu thức, nhưng chỉ biểu thức cuối cùng được hiển thị, bạn có thể hoàn thành biểu thức ""của mình và biến của bạn sẽ bị ẩn.

Vì vậy, bạn có thể xác định biến bằng:

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

Đây có phải là một tính năng được ghi lại không?
Daniel F

@DanielF, tôi không thể tìm thấy. Tôi vừa xem nhận xét này , thử nghiệm ý tưởng, thích nó và quyết định thêm vào làm câu trả lời vì nó có nhiều khả năng hiển thị hơn và khó bị mất hơn.
Zanon

@DanielF, vừa tìm thấy câu trả lời được bình chọn cao này đề xuất giải pháp tương tự. Nó cũng không có liên kết doc.
Zanon

@DanielF, tôi đã cập nhật câu trả lời của mình. Tôi đã phải hỏi một câu hỏi để hiểu nó tốt hơn. Nó không phải là một tính năng đặc biệt. Chỉ là hành vi của các biểu thức nối.
Zanon

8
Thủ thuật này đặc biệt hữu ích khi bạn muốn biểu thức bị ràng buộc với các thay đổi phạm vi, thay vì chạy một lần trên init.
Ronny
Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.