2017-05-30 7 views
3

私はAngular 2を学んでいますが、私はユーザーngrx/storeにしようとしていますが、いくつかの特殊なケースではいくつかの問題があります。ngrx/store effectsネストされたオブジェクト

例親オブジェクトを削除しようとしています。私がしたいことは、子オブジェクトも削除することです。ここで

は私の実体である:

export class Discussion { 
    id: string; 
    name: string; 
    createdAt: Date; 
    posts: Post[]; 
} 

export class Post { 
    id: string; 
    title: string; 
    data: string; 
    createdAt: Date; 
    comments: Comment[]; 
} 

export class Comment { 
    id: string; 
    data: string; 
    createdAt: Date; 
} 

私は私の保存された議論は次のようになりますので、自分の状態を平らにするnormalizrを使用しています:私は3つのレデューサー、議論のための一つの減速を持って

{ 
    id: "1", 
    name: "First dicussion", 
    createdAt: "...", 
    posts: ["1", "2", "3", "5"] 
} 

、投稿用にもう1つ、コメント用にもう1つ。すべてのレデューサーが自分のタイプの削除アクションを処理します。ここでの議論の減速の例である:

export function reducer(state = initialState, action: discussion.Actions): State { 
switch (action.type) { 
    case discussion.REMOVE: { 
     const idToRemove = action.payload; 
     const newEntities = state.entities; 
     delete newEntities[idToRemove]; 
     return Object.assign({}, state, { 
      entities: newEntities 
     }); 
    } 
}} 

私のアクションは次のようになります。私は議論を削除すると

export class RemoveAction implements Action { 
readonly type = REMOVE; 

/** 
* Constructor 
* @param payload The id of the discussion to remove 
*/ 
constructor(public payload: string) { } 
} 

、私は議論やポスト効果に関連した記事を削除したい コメントを削除します削除された投稿に関連する

@Effect() 
removeDiscussion: Observable<Action> = this._actions 
.ofType(dicussion.REMOVE) 
.map((action: discussion.RemoveAction) => action.payload) 
.mergeMap(discId => { 

    // How to get posts from discussion id ??? 

    // Fire related Actions 
    return [ 
     new posts.RemoveAction(postsToRemove) 
    ]; 
}); 

私の質問は、議論のIDから削除する投稿を取得する方法である: 私はので、私はこの効果を使用したことを行うのですかngrxの効果を使用しましたか?

読んでいただきありがとうございます。

答えて

2

withLatestFromを使用して、店舗にアクセスすることができます。
import 'rxjs/add/operator/withLatestFrom';

エフェクトクラスで店舗を注入:

constructor(private _actions: Actions, private store: Store<fromRoot.State>) 

は、実際にはそれを使用します。

@Effect() 
removeDiscussion: Observable<Action> = this._actions 
    .ofType(dicussion.REMOVE) 
    .map((action: discussion.RemoveAction) => action.payload) 
    .withLatestFrom(this.store, (payload, state) => ({ discId: payload, state })) 
    .mergeMap(({ discId, state }) => { 
     // access the posts array of the discussion 
     const postsToRemove = state.discussions[discId].posts; 

     // Fire related Actions 
     return [ 
      new posts.RemoveAction(postsToRemove) 
     ]; 
    }); 

構文.mergeMap(({ discId, state }) => ...destructuringと呼ばれています。
この構文が気に入らない場合は、.mergeMap((payloadAndState) => ...に置き換えることができます。その後、payloadAndState.discId

+0

こんにちはmtx、 お返事ありがとうございますdiscIdにアクセスします。これは私が探していたものです。 私はwithLatestFromを知りませんでしたので、状態オブジェクトにアクセスする方法を知りました。 さらに、この構造化構文もかなりクールです。 withLatestFromを使用しているときにエラーが発生した場合、forgerに 'import 'rxjs/add/operator/withLatestFrom';'を追加しないでください。私は初心者なので、追加するのを忘れました。 – Lopeur

+0

うれしい私は助けることができます。他の人がこの質問に遭遇した場合、私はその答えにimportステートメントを追加しました。ヒントありがとう! – mtx

関連する問題