javascript - 将新日期推送到 ember javascript 数组

Question

我正在使用 javascript 对象数组创建一个基本的 ember 应用程序(在我牢牢掌握之前不想使用其他任何东西)。我遇到麻烦了实现添加新用户的功能。我不确定要添加到我的 Controller 中的内容。

在模板中:

<form {{action 'add-student' on="submit"}}> 
{{input id="add-student" type="text" placeholder="student name"  value=name}}
<button class="btn btn-default" type="submit">Add</button>
</form>

我的学生路线:从 'ember' 导入 Ember；

 var students = [{
  id: 1,
  name: 'John',

}, {
  id: 2,
  name: 'Vanessa'     
}];

export default Ember.Route.extend({
  model() {
    return students;
  }
});

Answer 1

对于路线，您可能需要这样的东西。使用 Ember.RSVP.hash 它允许您从模型返回 1-n 属性。

export default Ember.Route.extend({
  model() {
    const store = this.get('store');
    return Ember.RSVP.hash({
        students: Ember.A([
          store.createRecord('student', { name: 'Vanessa'})
        ]),
        someOtherModelThing: store.find('xx') 
    })
  }
});

在模板中你会想要这样的东西。

{{input type="text" value=name}}

<button class="btn btn-default" {{action "addNewStudent" name}}>Add</button>

要处理 addNewStudent，您需要在 Controller 中编写一个操作。

...

    actions: {
       addNewStudent(studentName) {
          const store = this.get('store');
          var newStudent = store.createRecord('student', {name: studentName});
          this.get('model.students').pushObject(newStudent);
       }
    }

...

如果您还想保存它们，您可能需要带有“saveStudents”操作的保存按钮。

saveStudents: function() {
   return Ember.RSVP.all(this.get('model.students').invoke('save'))
}

显示模板中的学生列表。

{{#each model.students as |student|}}
    <p> {{student.name}}
{{/each}}

所有这些都可以在不使用 ember-data (store.createRecord 等)的情况下实现。使用纯 JSON 和 Ajax 来保存数据。