2012-01-10 15 views
12

Sử dụng đã lạm dụng-ví dụ ứng dụng todo, chúng ta hãy nói rằng tôi muốn một phần tử với một "todo" class (static) và một "được-thực hiện" đẳng cấp (động):Trong mẫu Handlebars Ember.js, có cách nào để có cả thuộc tính lớp tĩnh và động không?

<div {{bindAttr class="todo isDone"}}> 
    Other stuff in here 
</div> 

Trong trường hợp này , "isDone" và "todo" đều được cho là thuộc tính trên đối tượng xem của tôi, đó là những gì tôi muốn cho "isDone", nhưng không phải cho "todo". Tôi hiện đang làm việc xung quanh điều này bằng cách thêm một "todo" bất động sản trên quan điểm của tôi đó là bằng một chuỗi "todo" tĩnh. Có cách nào để có một thuộc tính lớp tĩnh khi sử dụng bindAttr?

Fiddle dụ: http://jsfiddle.net/nes4H/4/

Trả lời

23

EDIT :

Chúng tôi đã sửa lỗi này trong Ember!

Trên một build từ thạc sĩ, hoặc sau khi 0.9.6 được phát hành, bây giờ bạn có thể làm:

<div {{bindAttr class="App.foo:a-bound-class :a-static-class"}}></div>


câu trả lời trước:

Bạn tiếc là không thể có cả tên lớp tĩnh và động khi sử dụng bindAttr.

Tôi đề xuất sử dụng một hoặc nhiều thuộc tính được tính trên chế độ xem của bạn để xuất cả tên lớp tĩnh và động.

Hỗ trợ cả tên lớp tĩnh và động sẽ rất đẹp, nhưng cách bindAttr hiện đang hoạt động, điều đó là không thể. bindAttr không biết bất kỳ điều gì về phần tử được gắn vào trong quá trình biên dịch mẫu.

+0

Bummer. Cảm ơn. – adamlogic

+1

Được cập nhật để phản ánh tính năng mới. – ebryn

+0

Chưa được đăng ký? Hay tôi vừa bỏ lỡ nó? – dechov

3

Tôi không biết nếu bạn có thể làm điều đó với bindAttr, nhưng #view helper không cho phép bạn thiết lập cả hai lớp tĩnh và những người năng động:

{{#view App.TodoView class="todo" classBinding="isDone"}} 
    inner content 
{{/view}} 
2

Trong chế độ Master Ember, thay đổi đã được cam kết hôm nay để cho phép các lớp tĩnh được chỉ định trong phạm vi bindAttr bằng cách thêm một dấu hai chấm.

https://github.com/emberjs/ember.js/commit/ce385e3294be019215c555511c7f393aebc02e41

này có thể thay đổi trước khi phiên bản tiếp theo, tất nhiên, nhưng đây là một vấn đề mà các nhóm nòng cốt Ember muốn giải quyết.

0

Trong chế độ ember 1.10.0, bindAttr không được dùng nữa. Bạn có thể trực tiếp ràng buộc một biến đến lớp div. đây biến màu được ràng buộc với lớp của một div:

<div class="{{color}}"></div> 

Các inline nếu helper cũng có thể được sử dụng trong các tình huống:

<div class="{{color}} {{if isEnabled 'active' 'disabled'}}"></div> 

http://emberjs.com/blog/2015/02/07/ember-1-10-0-released.html

Các vấn đề liên quan