Truy cập một biến bên ngoài phạm vi của một Vòng lặp Handbars.js


187

Tôi có một mẫu handlebars.js, giống như thế này:

{{externalValue}}

<select name="test">
    {{#each myCollection}}
       <option value="{{id}}">{{title}} {{externalValue}}</option>
    {{/each}}
</select>

Và đây là đầu ra được tạo ra:

myExternalValue

<select name="test">
       <option value="1">First element </option>
       <option value="2">Second element </option>
       <option value="3">Third element </option>
</select>

Như mong đợi, tôi có thể truy cập idtitlecác trường của mọi yếu tố myCollectionđể tạo lựa chọn của mình. Và ngoài lựa chọn, externalValuebiến của tôi được in chính xác ("myExternalValue").

Thật không may, trong các văn bản của tùy chọn, externalValuegiá trị không bao giờ được in ra.

Câu hỏi của tôi là: làm thế nào tôi có thể truy cập vào một biến ngoài phạm vi của các tệp xử lý mỗi từ trong vòng lặp?

Câu trả lời:


453

Thử

<option value="{{id}}">{{title}} {{../externalValue}}</option>

Đoạn ../đường dẫn tham chiếu phạm vi mẫu cha nên là những gì bạn muốn.


10
Nếu độc giả tương lai vẫn gặp rắc rối như tôi, hãy xem bình luận cho câu trả lời này ở đây. Phải mất một lúc sau khi thấy câu trả lời này mới thấy câu trả lời đó. Bạn có thể cần phải sử dụng ../nhiều lần tùy thuộc vào bao nhiêu phạm vi so với giá trị bạn đang có.
bcmcfc 17/12/13

10
Tôi có điên không hay loại thông tin có giá trị này không được tìm thấy trên các tài liệu tay lái ???
Jesse

1
@spliter sẽ hoạt động trên các tay lái ember .. có vẻ như nó không hoạt động
kweku360

1
Không có ý tưởng @ kweku360. Điều này làm việc cho hadlebars bình thường. Có thể là Ember đang sử dụng phiên bản tay lái tùy chỉnh trong đó chức năng này được triển khai bằng một phương tiện khác
spliter

1
Cảm ơn bạn, điều này cũng hoạt động hoàn hảo với Foundation 6 Panini.
Marco

13

Hoặc bạn có thể sử dụng đường dẫn tuyệt đối như thế này:

<option value="{{id}}">{{title}} {{@root.user.path.to.externalValue}}</option>

1

Tôi thấy nhiều liên kết với 404 cho tài liệu về chủ đề này.

Tôi cập nhật nó với cái này, nó hoạt động vào ngày 1 tháng 4 năm 2020 :

https://handlebarsjs.com/guide/expressions.html#path-expressions

Một số trợ giúp như #with và #each cho phép bạn đi sâu vào các đối tượng lồng nhau. Khi bạn bao gồm ../ phân đoạn vào đường dẫn của mình, Tay lái sẽ thay đổi trở lại bối cảnh gốc.

    {{#each people}}
    {{../prefix}} {{firstname}} 
    {{/each}}

Mặc dù tên được in trong bối cảnh của một bình luận, nó vẫn có thể quay lại bối cảnh chính (đối tượng gốc) để lấy tiền tố.

CẢNH BÁO

Giá trị chính xác mà ../ sẽ giải quyết thay đổi dựa trên người trợ giúp đang gọi khối. Sử dụng ../ chỉ cần thiết khi bối cảnh thay đổi. Con của những người trợ giúp như {{#each}} sẽ yêu cầu sử dụng ../ trong khi con của những người trợ giúp như {{#if}} thì không.

{{permalink}}
{{#each comments}}
  {{../permalink}}

  {{#if title}}
    {{../permalink}}
  {{/if}}
{{/each}}

Trong ví dụ này, tất cả các tham chiếu ở trên có cùng giá trị tiền tố mặc dù chúng nằm trong các khối khác nhau. Hành vi này là mới kể từ Tay cầm 4, ghi chú phát hành thảo luận về hành vi trước cũng như kế hoạch di chuyển.

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.