我需要在调用 API 请求后分派多个操作。我目前正在使用此代码在 API 请求完成后分派一个操作:
changeStatus$ = createEffect(() =>
this.actions$.pipe(
ofType(fromJtDetail.changeStatus),
switchMap(action =>
this.jtDetailService.changeStatus(action.entity,action.jobTicketId).pipe(
map(res => fromJtDetail.statusChanged({changedStatus: action.entity.newStatus})),
catchError(error => EMPTY)
))));
Run Code Online (Sandbox Code Playgroud)
在这个效果中调度更多的动作很重要,不能为此编写另一个效果。
ngrx/Store和reducer都是新手.基本上,我有这个减速器:
import {StoreData, INITIAL_STORE_DATA} from "../store-data";
import {Action} from "@ngrx/store";
import {
USER_THREADS_LOADED_ACTION, UserThreadsLoadedAction, SEND_NEW_MESSAGE_ACTION,
SendNewMessageAction
} from "../actions";
import * as _ from "lodash";
import {Message} from "../../shared-vh/model/message";
import {ThreadsService} from "../../shared-vh/services/threads.service";
export function storeData(state: StoreData = INITIAL_STORE_DATA, action: Action): StoreData {
switch (action.type) {
case SEND_NEW_MESSAGE_ACTION:
return handleSendNewMessageAction(state, action);
default:
return state
}
}
function handleSendNewMessageAction(state:StoreData, action:SendNewMessageAction): StoreData {
const newStoreData = _.cloneDeep(state);
const currentThread = newStoreData.threads[action.payload.threadId];
const newMessage: Message = {
text: action.payload.text,
threadId: action.payload.threadId,
timestamp: new …Run Code Online (Sandbox Code Playgroud) 我想合并来自多个observable的最新发射值,所以现在我正在使用.withLatestFrom.除此之外,它将数据嵌套在嵌套数组中,而不是将数据推送到新的数组值.示例代码如下.
任何想法如何使用.withLatestFrom检索多个可观察的发射?
.withLatestFrom(source1)
.withLatestFrom(source2)
.withLatestFrom(source3)
.map((data) => { console.log(data) });
Run Code Online (Sandbox Code Playgroud) 我正在使用智能/转储组件构建我的Redux(NgRx)应用程序,但我正在努力决定愚蠢的组件应该是多么"愚蠢"......
例如,我有一个智能组件(posts),它有一个哑组件(post-list),其中包含哑组件(post).直到这里一切都很好看.
要显示一些按钮,我需要知道用户是否是admin,我需要将属性admin一直传递posts给post.
我可以将哑组件连接post到商店并直接从哑组件中获取.或者在这种情况下组件是否更愚蠢?它看起来像这样:
private admin$: Observable<boolean>;
constructor(private store: Store<AppState>){
this.admin$ = this.store.let(isAdmin());
}
Run Code Online (Sandbox Code Playgroud)
我认为这样可以节省大量的冗余.这是好事还是坏事?
redux的需求是什么,因为我们也可以保存并从服务中获取数据,据我所知,我们也可以将数据保存并保存到服务中,并且该服务可以被其他组件使用
我估计他们发布了一些重大更改,这是我收到的错误消息:
类型'typeof StoreModule'上不存在属性'provideStore'.
我用Google搜索了这条错误消息,但没有找到任何内容.不过我想有一些我不知道的API更新.
任何人都能指出我正确的方向吗?
我在我的Angularv5应用程序中使用@ngrx/router-store我最近开始遇到一个错误:( Navigation ID X is not equal to the current navigation id Y其中X和Y是整数).
这个问题一直发生,当我浏览来路由来自特定路由B.从任何其他途径向导航路线A似乎很好地工作.
我发现的与此相关的唯一其他SO问题提供了可能由于多次快速更新导航而导致问题的可能性.为了测试这是否发生(它不应该),我订阅了我的根组件内的路由器导航事件,在订阅中设置了一个断点,并打开了一个调试会话来逐步解决问题.这样做,我可以看到
假设当前导航ID为11.当我导航到问题路径时,路由器开始导航,成功执行包括的每个导航事件NavigationEnd,然后立即@ ngrx/router-store抛出一个'ROUTER_CANCEL'操作,说明:Navigation ID 12 is not equal to the current navigation id 13.据我所知,12是正确的导航ID(同样,导航ID 11完成并立即'ROUTER_CANCEL'抛出,而路由器不会发出任何进一步的导航事件).此外,'ROUTER_CANCEL'操作有效负载包含导致问题的路由器导航事件,以及导致问题时的存储状态.导致问题的事件的ID为12,当时商店中的路由器状态的ID为11.因此,12似乎是正确的导航ID,不应该抛出错误.
在从问题路径导航到用户配置文件路由时,在@ ngrx/router-store取消导航之前不会发生其他导航.(即我没有快速更新导航路线)
除了ngrx调度'ROUTER_CANCEL'操作之外,不报告任何错误(并且不会抛出任何错误).
再次,遇到问题的路线工作正常,除非从特定路线B开始导航.据我所知,这条特定路线B没有任何不同或不同寻常的问题(问题路线也不关心人们来自何处 - 这两条路线彼此没有关联).
最后一两件事:触发错误调试会话之外似乎总是在形式造成的错误Navigation ID X is not equal to the current navigation id X+1,但是引发了调试会话中的错误可能导致Navigation ID 11 is not equal to the current navigation id 15 …
结构1
reducers
index.ts //Combine all reducers
user.reducer.ts
product.reducer.ts
actions
index.ts //Combine all actions
user.action.ts
product.action.ts
effects
index.ts //Combine all effects
user.effect.ts
product.effect.ts
selector
//Combine all selectors
user.selector.ts
product.selector.ts
Run Code Online (Sandbox Code Playgroud)
要么
user
user.reducer.ts
user.action.ts
user.effect.ts
user.selector.ts
product
product.reducer.ts
product.action.ts
product.effect.ts
product.selector.ts
reducers.ts //Combine all reducers
actions.ts //Combine all actions
effects.ts //Combine all effects
selectors.ts //Combine all selectors
Run Code Online (Sandbox Code Playgroud) 我遇到了ngrx商店的问题,没有调度一个应该处理它的效果的动作.
以下是尝试发送的组件:
signin() {
this.formStatus.submitted = true;
if (this.formStatus.form.valid) {
this.store.dispatch(new StandardSigninAction(this.formStatus.form.value.credentials));
}
}
Run Code Online (Sandbox Code Playgroud)
行动:
export const ActionTypes = {
STANDARD_SIGNIN: type('[Session] Standard Signin'),
LOAD_PERSONAL_INFO: type('[Session] Load Personal Info'),
LOAD_USER_ACCOUNT: type('[Session] Load User Account'),
RELOAD_PERSONAL_INFO: type('[Session] Reload Personal Info'),
CLEAR_USER_ACCOUNT: type('[Session] Clear User Account')
};
export class StandardSigninAction implements Action {
type = ActionTypes.STANDARD_SIGNIN;
constructor(public payload: Credentials) {
}
}
...
export type Actions
= StandardSigninAction
| LoadPersonalInfoAction
| ClearUserAccountAction
| ReloadPersonalInfoAction
| LoadUserAccountAction;
Run Code Online (Sandbox Code Playgroud)
效果:
@Effect()
standardSignin$: Observable<Action> = this.actions$ …Run Code Online (Sandbox Code Playgroud) 我有这样的副作用:
@Effect()
FetchAllOrders$ = this.actions$
.ofType(SalesOrderActions.FETCH_ALL_ORDERS)
.switchMap((action: Action) => {
return this.soApiService.getUsersSalesOrders(action.payload);
})
.map((salesOrders: ListDto<SalesOrderList>) => this.actions.fetchAllOrdersSuccess(salesOrders));
Run Code Online (Sandbox Code Playgroud)
我想在效果开始时显示加载符号并在结尾隐藏它.
我创建了一组独立的Actions,Reducers和store状态来处理显示加载符号.
export class BusyActions {
static SHOW_SPINNER = "SHOW_SPINNER";
static HIDE_SPINNER = "HIDE_SPINNER";
showSpinner(): Action {
return { type: BusyActions.SHOW_SPINNER };
}
hideSpinner(): Action {
return { type: BusyActions.HIDE_SPINNER };
}
export const BusyState: IBusyState = {
visible: false,
busy: false
};
Run Code Online (Sandbox Code Playgroud)
我这样做是因为加载状态需要与其他模块,状态等共享.
如何从副作用中调用我的BusyActions?我需要在开始时调用SHOW_SPINNER,最后调用HIDE_SPINNER.
我做得对吗?或者有更好的方法来处理这个问题吗?