Ember选择设置内容绑定

Ember Select set content binding

本文关键字:绑定 设置 选择 Ember      更新时间:2023-11-04

我有一个相当复杂的Ember设置,在更大的View中使用嵌套的View/模板。我的父视图有一个控制器,上面有一个数组,我想在内部view/模板中将其用作Select的contentBinding。

我已经让手柄助手在我的内部模板中工作,但我也想以编程方式扩展Select,以添加一些验证样式支持。当我扩展Ember.但是选择并设置它不需要的contentBinding。

我的模板中的示例:

{{view Ember.Select 
       prompt="Choose" 
       classNames="span12" 
       contentBinding="view.parentView.controller.countrylist" 
       optionLabelPath="content.name" 
       optionValuePath="content.id" 
       selectionBinding="view.parentView.controller.selectedObject"
       valueBinding="view.parentView.controller.model.state"}}

作为使用{{View-View.selectBox}}显示的视图,我将selectBox设置为SelectBoxView。

SelectBoxView = Ember.Select.extend({
    prompt: "Please Choose",
    contentBinding: 'parentView.controller.countrylist',
    selectionBinding: 'parentView.controller.selectedObject',
    optionLabelPath: 'content.name',
    optionValuePath: 'content.id',
    classNames: ["span12"]

两个Selects都显示,但只有纯车把有数据显示。我已经尝试了我能想到的每一种组合,以在我的外部视图控制器中进入国家名单。

编辑:http://emberjs.jsbin.com/oxAluJI/2/edit?html,js,输出

好吧,我今天早上都搞砸了。我遇到的问题是从"家长"控制者那里获取国家。我没有一个适合我所处的景色的,我想我可以四处制作一个。

您不想在绑定中进行这样的硬编码,这是一种糟糕的做法。尤其是因为他们正在超出自己的范围寻找价值。将国家/地区列表数组向下传递到视图中,并在创建选择器实例时附加它。

http://emberjs.jsbin.com/alAQEgux/3/edit

App.AppleView = Em.View.extend({
  templateName: 'apple'
});
App.SelectBoxView = Ember.Select.extend({
    prompt: "Please Choose",
    optionLabelPath: 'content',
    optionValuePath: 'content',
    classNames: ["span12"]
});
<script type="text/x-handlebars" data-template-name="index">
  {{view App.AppleView countryList=model}}
</script>
<script type="text/x-handlebars" data-template-name="apple">
  Apples
  {{view App.SelectBoxView contentBinding=view.countryList}}
</script>