Ember.在使用路由器的应用中选择内容绑定
Ember.Select contentBinding in app that uses router
我有一个使用Ember.Router结构的Ember.js应用程序。
我的应用结构如下所示
window.App = Ember.Application.create {
#Truncated idea of app, not including application controller or any of that
MainController = Ember.Controller.extend()
MainView = Ember.View.extend
templateName: 'main-template'
因此,控制器和视图是扩展的,而不是在创建应用程序时创建的。然后有连接插座的路线
Router: Ember.Router.extend
root: Ember.Route.extend
main: Ember.Route.extned
route: '/'
connectOutlets: (router, event) ->
router.get('applicationController').connectOutlet('main')
我需要将<select>
标签绑定到一组值。 Ember.Select
看起来是一个很好的方法,所以我为选择
MySelectController: Ember.ArrayController.extend
contents: [{id:1,title:'test'},{id:2,title:'test2'}]
MySelectView: Ember.Select.extend
contentBinding: this.get('controller')
contentValuePath: 'id'
contentLabelPath: 'title'
这行不通。当我尝试包含在带有{{#view App.MySelectView}}
的视图中时,我收到有关this.get('controller')
的错误
我该怎么做呢?
这是我如何实现这一点的示例: jsfiddle
车把模板:
<script type="text/x-handlebars" data-template-name="application">
<header>
<h1>Ember Router Sample</h1>
</header>
{{outlet}}
</script>
<script type="text/x-handlebars" data-template-name="myForm">
{{view view.mySelectView
selectionBinding="controller.selected"
contentBinding="view.controller.content.persons"
}}
{{view Ember.TextField valueBinding="controller.selected.name"}}
</script>
JavaScript:
App = Ember.Application.create();
App.ApplicationController = Em.Controller.extend();
App.ApplicationView = Em.View.extend({
templateName: 'application'
});
App.MySelectController = Em.ArrayController.extend();
App.MyFormController = Em.Controller.extend({
selected: null,
});
App.MyFormView = Ember.View.extend({
templateName: 'myForm',
mySelectView: Em.Select.extend({
optionLabelPath: 'content.name',
optionValuePath: 'content.id'
})
});
App.Router = Em.Router.extend({
root: Em.Route.extend({
index: Em.Route.extend({
route: '/',
connectOutlets: function(router, context) {
router.get('applicationController').connectOutlet({
name: 'myForm',
context: Ember.Object.create({
persons: [{id:0, name: "Wayne"}, {id: 1, name: "Gart"}]
})
});
}
})
})
});
App.initialize();
相关文章:
- Ember选择绑定-如何使其着火
- 由其他Ember Select填充的Ember Select不更新选择绑定
- 角度选择绑定字典
- 选择绑定到同一范围的按钮,单击时会相互触发.如何从angular.js中的两个选择列表按钮解除范围绑定
- 如何将 HTML 选择绑定到 Rivets.JS 中的模型值
- 在呈现项目后,挖空选择绑定回调的选项
- 在 angularjs 中使用选择绑定
- Knockout.js选择绑定到对象的值
- 使用angularjs、jquery、json、ajax基于下拉选择绑定html表数据
- knockoutjs选项对选项和选择绑定的适应
- 取消验证,选择绑定,不添加erroelement .css
- 从选择绑定中删除数据绑定没有更新自定义事件
- Angular选择——绑定到模型(而不是值)
- 在Angularjs中选择绑定ng-model的对象
- Angular js选择绑定
- Knockout:选择绑定返回值数组
- Emberjs选择绑定
- 使用enter键选择绑定到输入的Datalist元素
- 删除自定义选择绑定器与更新功能
- dom事件-JavaScript onchange选择绑定问题