就在我认为我正在处理余烬的时候,这种情况发生了,我碰到了一堵砖墙。
我有
App.Router.map(function() {
this.resource('customers', function() {
this.resource('customer', {
path : ':customer_id'
});
客户路线:
App.CustomersRoute = Ember.Route.extend({
model: function() {
return this.store.find('customer');
},
客户控制员:
App.CustomerController = Em.ObjectController.extend({
needs: ['state'],
isEditing: false,
isNotEditing: Ember.computed.not('isEditing'),
actions : {
startEditing: function() {
this.set('isEditing',true);
this.set('validationErrors', '');
},
save: function() {
和这些模板:
<script type="text/x-handlebars" data-template-name="customers">
...
{{outlet}}
...
</script>
<script type="text/x-handlebars" data-template-name="customer">
...
{{#if isEditing}}
<div class="well well-sm">
<a class="btn btn-success" {{action save}}>Save</a>
<a class="btn btn-warning" {{action cancel}}>Cancel</a>
</div>
{{else}}
<div class="well well-sm">
<a class="btn btn-primary" {{action startEditing}}>Edit</a>
<a class="btn btn-danger" {{action delete}}>Remove</a>
</div>
{{/if}}
这对我来说都很好。我可以选择一个客户,按下编辑按钮,表单输入获得启用,按下保存按钮并将更改的数据持久地返回到数据库
然而:这是我的砖墙。
如何启用功能以创建新记录:我不想复制编辑表单,只显示空白
我假设我需要将“new”放入路由器地图
this.resource('customers', function() {
this.resource('customer', {
path : ':customer_id'
});
route('new');
});
但我是否要创建CustomerNew控制器和CustomerNew路由以及CustomerNew模板?
我已将操作添加到客户控制器
<a class="btn btn-primary btn-xs pull-right" {{action startNew}}>New</a>
我真的需要创建一个路线&amp;控制器&amp;模板只是为了处理新动作?或者我可以重用客户/ 1路线/控制器/模板吗?
感谢
答案 0 :(得分:1)
做事Ember Way(TM)你想要使用新的路线,控制器和模板。 Ember确实可以轻松整合您的逻辑,而不必重复代码。在模板中,您可以使用partial
执行此操作,在JS代码中,您可以使用Ember.Mixin
执行此操作。
这是一个总体思路的JSBin:http://jsbin.com/ucanam/1056/edit
以下是模板的有趣部分:
<script type="text/x-handlebars" data-template-name="customers/new">
Add a new customer<br/>
{{partial "customers/form"}}
</script>
<script type="text/x-handlebars" data-template-name="customer/edit">
Edit a customer<br/>
{{partial "customers/form"}}
</script>
<script type="text/x-handlebars" data-template-name="customers/_form">
{{input value=name}}
<button {{action save}}>Save</button>
<button {{action cancel}}>Cancel</button>
</script>
然后是控制器:
App.CrudController = Ember.Mixin.create({
actions : {
save : function(){
this.get('model').save();
this.transitionToRoute('customers');
},
cancel : function(){
this.get('model').rollback();
this.transitionToRoute('customers');
}
}
});
App.CustomersNewController = Ember.ObjectController.extend(App.CrudController,{});
App.CustomerEditController = Ember.ObjectController.extend(App.CrudController,{});