ngrx/store 影响嵌套对象
ngrx/store effects nested objects
我正在学习 Angular 2,我正在尝试使用 ngrx/store,但我在某些特殊情况下遇到了一些困难。
示例我正在尝试删除父对象。我想做的是也删除子对象。
这是我的实体:
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 来展平我的状态,因此我存储的讨论将如下所示:
{
id: "1",
name: "First dicussion",
createdAt: "...",
posts: ["1", "2", "3", "5"]
}
我有 3 个 reducer,一个用于讨论,另一个用于帖子,最后一个用于评论。所有 reducer 都处理自己类型的 delete Action。这是讨论缩减器的示例:
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) { }
}
当我删除一个讨论时,我要删除与该讨论相关的帖子,帖子效果将被删除
与已删除帖子相关的评论。
我使用了 ngrx 的效果,所以我使用了这个效果:
@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 中删除帖子?
感谢阅读。
您可以使用withLatestFrom
访问效果中的商店。
(import 'rxjs/add/operator/withLatestFrom';
)
在effects中注入store-class:
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
访问 discId
我正在学习 Angular 2,我正在尝试使用 ngrx/store,但我在某些特殊情况下遇到了一些困难。
示例我正在尝试删除父对象。我想做的是也删除子对象。
这是我的实体:
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 来展平我的状态,因此我存储的讨论将如下所示:
{
id: "1",
name: "First dicussion",
createdAt: "...",
posts: ["1", "2", "3", "5"]
}
我有 3 个 reducer,一个用于讨论,另一个用于帖子,最后一个用于评论。所有 reducer 都处理自己类型的 delete Action。这是讨论缩减器的示例:
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) { }
}
当我删除一个讨论时,我要删除与该讨论相关的帖子,帖子效果将被删除 与已删除帖子相关的评论。 我使用了 ngrx 的效果,所以我使用了这个效果:
@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 中删除帖子?
感谢阅读。
您可以使用withLatestFrom
访问效果中的商店。
(import 'rxjs/add/operator/withLatestFrom';
)
在effects中注入store-class:
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
discId