我正在使用带有emberjs rc6的bootstrap。我想使用渲染助手来显示bootstrap模态。这就是我所做的:
avatar.hbs:
<aside class='avatar-aside'>
**{{#if inEditModel}}
{{render 'avatar/edit' model}}
{{/if}}**
</aside>
<div class='avatar-inner'>
{{#if canManage}}
<a class='lnk-edit' href='#' **{{action 'edit'}}**>
<img class='image-medium' {{bindAttr src='imageMediumPath'}}>
<span class='bar-edit'><i class='icon-edit'></i></span>
</a>
{{else}}
<img class='image-medium'
{{bindAttr src='imageMediumPath'
alt='controllers.user.basicinfo.nickname'}}>
{{/if}}
</div>
avatar_controller.js.coffee
Yu.AvatarController = Em.ObjectController.extend
inEditModel: false
edit: ->
@set 'inEditModel', true
化身/ edit_view.js.coffee
Yu.AvatarEditView = Em.View.extend
tagName: 'section'
classNames: 'avatar-edit modal fade'.w()
didInsertElement: ->
@$().modal
backdrop: 'static'
keyboard: false
willDestroyElement: ->
@$().modal 'hide'
化身/ edit_controller.js.coffee
Yu.AvatarEditController = Em.ObjectController.extend
needs: 'avatar flashEmbeded'.w()
close: ->
@get('controllers.avatar').set 'inEditModel', false
cancel: ->
@get('controllers.avatar').set 'inEditModel', false
update: ->
userId = @get 'userId'
Yu.Avatar.
update(userId).
done((response) =>
@get('controllers.avatar').set 'inEditModel', false
).
fail((response) =>
errormsg = $.parseJSON(response.responseText).errors[0]
@get('controllers.flashEmbeded').notify 'errormsg', errormsg
)
如您所见,我想通过切换头像控制器的inEditModel来显示或隐藏头像/编辑模板。直到现在,我所知道的就是我 @get('controllers.avatar')。set'inEditModel',false在头像编辑控制器中,头像控制器中的inEditModel不会改变。 我想知道我是否有两个不同的头像控制器实例。我做错了什么?谢谢!
答案 0 :(得分:1)
我猜你在这里遇到了一些绑定问题,可能有助于尝试定义更像这样的事情:
Yu.AvatarEditController = Em.ObjectController.extend
needs: 'avatar flashEmbeded'.w()
avatarControllerBinding: 'controllers.avatar'
close: ->
@get('avatarController').set 'inEditModel', false
cancel: ->
@get('avatarController').set 'inEditModel', false
...
至于bootstrap模式,你一定要看看这个插件https://github.com/emberjs-addons/ember-bootstrap。我自己成功地使用了它,并且与ember.js rc6有关。
希望它有所帮助。