ember.js不{{bindAttr}} <label>对于集合中正确的inputField.elementId

我试图使用{{bindAttr}}和输入字段的[的viewName] .elementId。它在单个条目视图中工作，但不是在显示多条记录时：它只是将标签链接到集合中的最后一个输入字段。（这适用于使用的是老烬库在先前的反复工作，但现在它does not。）我创建了一个fiddle，但它的要点是：ember.js不{{bindAttr}} <label>对于集合中正确的inputField.elementId

{{#each controller}} 
    <fieldset>    
     <label {{bindAttr for="view.tbFullName.elementId"}}>Full Name</label> 
     {{view App.DetailTextField viewName="tbFullName" placeholder="Full Name" valueBinding="fullName" readonly="readonly"}}        
    </fieldset> 
{{/each}}

我想也许我可以创建的CollectionView和创建viewName的计算属性，它将为集合中的每个项目生成一个唯一的ID，在回答另一个问题here时提及。但是，这样做太复杂了 - 只要用户点击相应的标签，我就可以让输入字段自己突出显示。

任何帮助表示赞赏。

来源

2013-07-09 user2192333

围绕标签和输入字段创建一个包装Ember.View。让我们把它叫做App.FieldView：

App.FieldView = Ember.View.extend({ 
    tagName: 'fieldset' 
});

在你的模板

然后：

{{#each controller}} 
    {{#view App.FieldView}}    
    <label {{bindAttr for="view.tbFullName.elementId"}}>Full Name</label> 
    {{view App.DetailTextField viewName="tbFullName" placeholder="Full Name" valueBinding="fullName" readonly="readonly"}}        
    {{/view}} 
{{/each}}

小提琴：http://jsfiddle.net/NQKvy/26/

来源

2013-07-09 22:57:07

谢谢！作品一种享受。 – user2192333

形式有点棘手我必须承认，如果你想做正确的事情。但是有一个可以用来解救的余烬插件，例如easyForm。

看看它可能可以帮助你解决你确切所面临的问题，就像那些在具有为您的表单字段等

希望它可以帮助独特的标签。

来源

2013-07-09 20:12:46 intuitivepixel

这是有趣的知道easyForm存在。我想我现在会继续手动建立我的表格，以便我能够了解我对Ember的理解。在这一点上，我也很担心依赖另一个库。非常感谢。 – user2192333

帕纳约蒂斯Panagi，正确地回答了这个问题。我只会补充为什么会发生这种情况，即： - 链接到错误的视图。

模板内的view属性引用了Ember视图包装html标记。然而，该属性取决于它所处的上下文具有不同的值。

该值取决于它放置的视图块。默认情况下，模板本身对应于在这种情况下的视图，ListOfPeopleTemplateView。

因此，当您绑定到view.tbFullName.elementId时，您实际上绑定到{instance of ListOfPeopleTemplateView}.tbFullName.elementId。当循环结束时，唯一可见的tbFullName是最后一个。

帕纳约蒂斯Panagi的解决方案是包装另一视图内的标签，所以view变化在该块中的值，并因此指向正确tbFullName

最后一个更简单的方法来实现相同的结果是将文本字段包装在标签内。那么你根本就不需要绑定label for。

<label>Full Name 
    {{view App.DetailTextField viewName="tbFullName" placeholder="Full Name" valueBinding="fullName" readonly="readonly"}}  
</label>

看到这个jsfiddle

来源

2013-07-10 04:16:51

感谢您在@ panagiotis-panagi上回答问题。如果我能理解为什么能让事情顺利进行，但更好。并将输入字段包裹在标签内 - 这种简单的解决方案！但是这样做会有什么副作用吗？围绕'label'和'label for'的 – user2192333

基本上是一样的。当文本字段的标签远离文本字段并且不能被它包围时，'label for'有助于帮助。 –

ember.js不{{bindAttr}} <label>对于集合中正确的inputField.elementId

回答

相关问题