Question

我试图在ember框架工作中使用check-box类型的twitter bootstrap按钮组。我有一个容器视图来按住按钮。每个按钮都是此容器视图的子项。为了使这个按钮的复选框功能正常工作，我必须添加一个名为'Data-Toggle'的属性。但是attributeBindings不能与ContainerViews一起使用。它可以正常使用View和CollectionViews。这是应用程序代码中的Bug还是问题？有没有办法克服这个？比如使用模板并使用那个???加载整个HTML请尽快帮助我

这是我的代码

$(function(){
Ed.View.Header = Em.ContainerView.extend({
classNames: ['btn-group'],
tagName:'div',
attributeBindings: ['data-toggle'],
data-toggle: 'buttons-checkbox',
childViews: ['archived', 'created', 'started', 'completed'],

'archived':Em.View.extend({
  classNames: ['btn'],
  tagName:'button',

  title:'Hide Archived',
  valueBinding: "Ed.state.hideArchived"
}),

'created':Em.View.extend({
classNames: ['btn'],
tagName:'button',
  title:'Hide Created',
  valueBinding: "Ed.state.hideCreated"
}),

'started':Em.View.extend({
classNames: ['btn'],
tagName:'button',
  title:'Hide Started',
  valueBinding: "Ed.state.hideStarted"
}),

'completed':Em.View.extend({
classNames: ['btn'],
tagName:'button',
  title:'Hide Completed',
  valueBinding: "Ed.state.hideCompleted"
})
});
});

Answer 1

没有足够的代码来运行您的示例，只是尝试一下：

attributeBindings: ['dataToggle:data-toggle'],
dataToggle: 'buttons-checkbox',

它应该成功。

Answer 2

感谢您的帮助。由于连字符是问题，我找到了像这样的修复

 attributeBindings: ["data-toggle"],
'data-toggle': 'buttons-checkbox',

呈现为

<div id="ember346" class="ember-view btn-group" data-toggle="buttons-checkbox">
<button id="ember354" class="ember-view btn"></button>
<button id="ember365" class="ember-view btn"></button>
<button id="ember376" class="ember-view btn"></button>
<button id="ember387" class="ember-view btn"></button></div>

attributeBindings不使用containerViews

2 个答案: