我正在尝试创建一个基本的CRUD设置来管理Ember中的“用户”对象。我想我的模型和路线都是有序的。我正在努力管理:
A)(所有)用户页面的正确控制器设置。我认为我应该创建一个ArrayController,但它似乎自动工作正常。我的Ember应用程序是否知道制作一系列单独的“用户”对象?如果是这样,怎么样?
B)从InputFields传递数据。如果您点击example中的“添加用户”,我就会创建一个表单来创建用户。单击“创建”时,我不确定如何获取textField值,也不知道在拥有这些值后如何处理这些值。我该如何更新我的控制器?
再次,这里是jsbin我的代码。任何指导都将不胜感激。
答案 0 :(得分:2)
关于A): 我假设你参考了你的App的以下路线。此模型函数返回一个Array。因此,Ember知道它应该使用ArrayController来呈现您的UsersRoute。
App.UsersIndexRoute = Ember.Route.extend({
model: function() {
return App.User.find();
}
});
关于B):我已更新您的代码 - > http://jsbin.com/ozilam/15/edit
我需要更新您的一些名称(控制器和视图)以匹配naming conventions of Ember。
使用Ember,您不必使用表单并手动读取这些值。而是在输入路线时创建新记录:
App.UsersNewRoute = Ember.Route.extend({
setupController : function(controller){
controller.set("content", App.User.createRecord({}));
}
});
在您的视图中,您绑定记录的属性。如您所见,我还使用操作助手更新了您的按钮。
<script type="text/x-handlebars" data-template-name="users/new">
<div class="row">
<div class="six columns">
<h3>New User Information</h3>
<form>
<label>First Name</label>
{{view Ember.TextField valueBinding='name_first'}}<br />
<label>Last Name</label>
{{view Ember.TextField valueBinding='name_last'}}<br />
<label>Email Address</label>
{{view Ember.TextField valueBinding='email_address'}}<br />
<label>SSN</label>
{{view Ember.TextField valueBinding='ssn'}}<br />
<button {{action create target="view"}} class="button">Create</button>
{{#linkTo users}}Cancel{{/linkTo}}
</form>
</div>
</div>
</script>
当表单中的更改自动传播到您的控制器时,您只需访问控制器中的对象:
App.UsersNewView = Ember.View.extend({
didInsertElement: function() {
this.$('input:first').focus();
},
create: function(){
console.log('view submitted');
var newUser = this.get("controller.content");
console.log(newUser.get("name_first"));
console.log(newUser.get("name_last"));
// HOW DO I PROCESS THIS FORM
}
});
注意:在我写这篇文章的时候,我意识到如果你在Controller而不是View中处理这个事件可能会更好,因为它是一个数据修改任务。