首页 文章

Emberjs 2.0使用来自商店的新数据更新路径模型（createRecord）

提问于
浏览 次
1

我是Ember的新手，所以我的方法可能不正确 . 我正在使用最新的Ember 2.9.1

我的计划是更新路径模型并使所有组件在集合中呈现新添加/保存的项目 .

（我想在调用 save （在 createRecord 上）后用 userRole 的新记录更新我的路线模型（ userRoles 数组） .

到目前为止，我有 route ，像这样 model ：

model(){
  // this is my "user.edit" route
  let user = this.modelFor('user');
  let newUserRole = this.get('store').createRecord('userRole');
  newUserRole.set('user_id', user.get('id'));

  return RSVP.hash({
    user: user,
    userRoles: store.query('userRole', { user_id: user.get('id') }),
    roles: store.findAll('role'),
    newUserRole: newUserRole
  });
}

然后我有一个控制器和几个修改newUserRole的组件 . 在路线中，我有一个保存新用户角色的操作：

actions: {
  saveNewUserRole: function () {
    let currentModel = this.modelFor('user.edit');
    currentModel.newUserRole.save().then(function (newUserRole) {
      currentModel.userRoles.addObject(newUserRole);
    });
  }
}

有趣的是，新项目（newUserRole）被添加到集合中，但在模型的控制台日志记录中告诉我新对象与集合中的其他对象有所不同 . 通过查看ember的类似问题，我发现人们使用： _internalModel 或 toArray() ：here和here或服务（？）来存储/更新数据 .

（也使用 pushObject 到 addObject （V1.3）改变;加上观察员监听 userRoles 更改不会被触发部件的内部，或者如果我叫 toArray() 我得到'Invalid value used as weak map key'错误）

问题：使用新项目更新路线模型的正确/ Ember方式是什么，并导致重新渲染我的模板 . 如果我应该为数据使用服务，那么服务是否应该将所有项目保留在 toArray() 或POJO中？

ember.js ember-data

1 回答

  • 1

    ember-data 将自动为您完成大部分丑陋的关系 .

    所以例如你永远不应该做这样的事情：

    newUserRole.set('user_id', user.get('id'));

    但总是如此：

    newUserRole.set('user', user);

    在 .save() ember-data 足够聪明，可以保存id .

    这看起来有点像你试图为给定用户加载所有 userRole ：

    store.query('userRole', { user_id: user.get('id') }),

    您应该只在必要时使用 query . 要获取关系，只需访问关系：

    user.get('roles'),

    假设你的 models/user-role.js 中有 roles: hasMany('userRole') .

    接下来使用 currentModel.userRoles.addObject 修改ember数据的结果数组 . 如果要更改关系，则只应执行此操作 . ember-data 会自动保持您的关系同步 . 因此，在 userRole 上设置 user 之后，新角色将自动位于 user.get('roles') 返回的实时数组中 . 所以实际上你永远不应该修改 .query() 返回的数组 .

    所以基本上这可能是你的 model 钩子：

    // this is my "user.edit" route
let user = this.modelFor('user');
let newUserRole = this.get('store').createRecord('userRole', {
  user
});

return RSVP.hash({
  user,
  userRoles: user.get('roles'),
  roles: store.findAll('role'),
  newUserRole,
});

    这可能是你的保存行动：

    actions: {
  saveNewUserRole: function () {
    let currentModel = this.modelFor('user.edit');
    currentModel.newUserRole.save();
  }
}

    但是，如果您只想在保存后显示新角色，则可能应该在查看时对 isNew=false 进行过滤 . 用户使用 userRolesFiltere: Ember.computed.filterBy('model.userRoles', 'isNew', false) 或 {{#unless role.isNew}} 这样的计算机属性 .

    回复于

相关问题