在Ember.js中使用复选框切换和绑定布尔值
在Ember.js中使用复选框切换和绑定布尔值
提问于 2014-02-25 08:03:03
我试图使用绑定复选框(photoApproved)在true和false值之间切换，但在我的控制器代码中没有这么幸运。
这是photos_controller.js
App.PhotosController = Ember.ArrayController.extend(
photoApproved: ((key, value) ->
model = @get("model")
if value is 'undefined'
model.get "approved"
else
model.set "approved", value
model.save()
value
).property("model.approved")
)下面是template文件photos.hbs
<h1>Photos</h1>
<ul>
{{#each controller}}
<li class="masonry-brick">
<h3>Approved: {{approved}}</h3>
{{input type="checkbox" checked=photoApproved class="toggle"}}
{{#link-to "photo" this}}{{name}}{{/link-to}}
<img {{bind-attr src=image_url}} alt="Logo">
</li>
{{else}}
<li>There are no photos.</li>
{{/each}}
</ul>
{{outlet}}最后，这里是model
App.Photo = DS.Model.extend(
name: DS.attr("string")
description: DS.attr("string")
image_url: DS.attr("string")
approved: DS.attr("boolean")
)我应该如何更改我的photoApproved函数以使其正常工作？
回答 3
Stack Overflow用户
回答已采纳
发布于 2016-03-18 21:34:03
Ember 2.4答案：
<input type="checkbox"
checked="{{if info.show_in_email 'checked'}}"
onclick={{action (mut info.show_in_email)
value="target.checked"}} />其中info是一个ember模型，而show_in_email是一个布尔型字段。
Stack Overflow用户
发布于 2014-02-25 14:38:56
我注意到两件事：
photoApproved是集合的属性，而不是单个模型的属性。
您应该为PhotosController定义一个itemController，并在其中定义photoApproved：
App.PhotosController = Ember.ArrayController.extend(
itemController: 'photo'
)
App.PhotoController = Ember.ObjectController.extend(
photoApproved: ((key, value) ->
model = @get("model")
if value is 'undefined'
model.get "approved"
else
model.set "approved", value
model.save()
value
).property("model.approved")
)接下来，我根本不明白为什么需要定义photoApproved。当您在复选框中使用approved作为检查值时，它已经绑定到模型。然后，您可以定义一个观察者来保存模型(但我不确定以下控制器代码是否正确)。
<li class="masonry-brick">
<h3>Approved: {{approved}}</h3>
{{input type="checkbox" checked=approved class="toggle"}}
{{#link-to "photo" this}}{{name}}{{/link-to}}
<img {{bind-attr src=image_url}} alt="Logo">
</li>
App.PhotoController = Ember.ObjectController.extend(
approvePhoto: (->
@get('model').save() unless @get('approved')
).observes("approved")
)Stack Overflow用户
发布于 2014-02-27 03:56:25
已通过删除approvePhoto函数上的unless @get('approved')解决。
# controller
App.PhotoController = Ember.ObjectController.extend(
approvePhoto: ((key, value) ->
@get('model').save()
).observes("model.approved")
)
# template
<li class="masonry-brick">
<h3>Approved: {{approved}}</h3>
{{input type="checkbox" checked=approved class="toggle"}}
{{#link-to "photo" this}}{{name}}{{/link-to}}
<img {{bind-attr src=image_url}} alt="Logo">
</li>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/22001845
复制相关文章
相似问题