2016-11-16 6 views
1

私はEmberを初めて使っているので、私のアプローチが間違っている可能性があります。 私は最新のEmber 2.9.1を使用していますEmberjs 2.0+ストアからの新しいデータでルートモデルを更新する(createRecord)

私の計画は、ルートのモデルを更新し、すべてのコンポーネントが新しく追加/保存されたアイテムをコレクションにレンダリングさせることです。

(私は()createRecordに保存を呼び出した後USERROLEの新記録と私のルートのモデル(userRoles配列)を更新したいです)。私はその後、newUserRoleを変更するコンポーネントのコントローラとカップルを持っている

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 
    }); 
} 

これまでのところ、私はこのようなモデルを持ってルートを持っています。私は、新しいユーザーロールを保存するためのアクションを持っているルートで :

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

興味深い何が新しいアイテム(newUserRole)をコレクションに追加されるということですが、モデルのコンソールログに新しいオブジェクトであることを私に伝えますコレクション内の他のオブジェクトとは種類が異なります。 は、私は、人々が使用することを見つける燃えさしのために同じような問題を通してみる: _internalModelまたはのtoArray()herehereやサービスのデータを更新/保存するための(?)。

は(ものaddObject
(バージョン1.3 +) にpushObject を使用してから変更し、プラスオブザーバーは変更が部品の内部でトリガーされません userRolesのリスニング、または私はのtoArray() Iを呼び出す場合

質問:経路のモデルを新しいアイテムで更新してテンプレートを再レンダリングする正しい/ Emberの方法は何ですか?データにサービスを使用する必要がある場合は、すべてのアイテムをtoArray()またはPOJOに保存しておく必要がありますか?

答えて

1

ember-dataあなたのための醜い関係の仕事のほとんどを自動的に行います。

したがって、たとえば、あなたがこのような何かべきではありません:

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

が、常にこの:.save()ember-dataオン

newUserRole.set('user', user); 

は、IDを保存するのに十分なスマートです。

また、これは特定のユーザーのすべてのuserRole Sをロードしようとしているビットyou'rのようになります。

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

必要なときにのみ、queryを使用する必要があります。関係をフェッチするだけの関係にアクセス:

user.get('roles'), 

はあなたのmodels/user-role.jsroles: hasMany('userRole')を持っていると仮定しました。

currentModel.userRoles.addObjectの次に、emberデータの結果配列を変更します。関係を変更する場合にのみこれを行う必要があります。 ember-dataはあなたの関係を自動的に同期させます。 userRoleuserを設定すると、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}}などのコンピュータプロパティがあります。

+0

この回答をいただきありがとうございます。私はこのような方法でページをセットアップしようとしています。しかし、私は "user.get( 'roles')"呼び出しを行って実際にサーバーに要求することはできません。 – GogromaT

+0

...または、むしろユーザーの呼び出しの一部として役割IDを返さなければならないのですか?私はREST Adapterを使用しています。ユーザーの一部として{roles:[role_ids]}を返さないと、emberはデータの個別リクエストを行いません。 – GogromaT

+1

[リンクの指定](http: //emberjs.com/api/data/classes/DS.RESTAdapter.html#method_findBelongsTo)。 – Lux

関連する問題