Question

我正在尝试实现一个解析器，该解析器将首先调度动作以从服务器检索所有数据，然后尝试捕获两个流responseOK和responseError，然后从解析器返回，无论哪个流首先发出值。此设置的灵感来自于github https://github.com/ngrx/store/issues/270#issuecomment-317232654

上的以下答案

这是我的解析器：

@Injectable({
    providedIn: "root"
})
export class ScheduleAdministrationResolver
    implements Resolve<Observable<Schedule.FetchAllSportTypesSuccess | Schedule.FetchAllSportTypesFailed>> {
    constructor(private store: Store, private actions$: Actions, private router: Router) {}

    resolve(
        route: ActivatedRouteSnapshot,
        state: RouterStateSnapshot
    ):
        | Observable<Schedule.FetchAllSportTypesSuccess | Schedule.FetchAllSportTypesFailed>
        | Observable<Observable<Schedule.FetchAllSportTypesSuccess | Schedule.FetchAllSportTypesFailed>>
        | Promise<Observable<Schedule.FetchAllSportTypesSuccess | Schedule.FetchAllSportTypesFailed>> {
        this.store.dispatch(new Schedule.FetchAllSportTypes());

        const responseOK = this.actions$.pipe(ofAction(Schedule.FetchAllSportTypesSuccess));

        const responseError = this.actions$.pipe(
            ofAction(Schedule.FetchAllSportTypesFailed),
            tap(() => this.router.navigate([""]))
        );
        console.log("Inside SportType resolver");
        return race(responseOK, responseError).pipe(first());
    }
}

this.store.dispatch(new Schedule.FetchAllSportTypes());方法最终调用如下所示的fetchAllSportTypes()：

fetchAllSportTypes(): Observable<SportType[]>{
 return of([{...}, {...}])
}

一切正常，并按预期触发。但是，解析器永远不会完成。看来race方法内部的流从不发出任何值。我确实知道Schedule.FetchAllSportTypesSuccess操作会在触发控制台时记录在控制台上，从而被调度。

我不明白为什么未按预期触发ofAction。

其他信息：这在延迟加载的管理功能内部。我通过以下方式连接NGXS：

app.module.ts;
imports: [
    ...NgxsModule.forFeature([SportTypeState]),
    NgxsModule.forRoot([], {
        developmentMode: true,
        selectorOptions: {
            suppressErrors: false,
            injectContainerState: false
        }
    })
];

Answer 1

我最终解决了这个问题。问题出在我的“异步”方法内部，该方法正在提取所有sportTypes。

fetchAllSportTypes(): Observable<SportType[]>
{
   return of([{...}, {...}])
}

以上方法在解析器内部不起作用。添加.pipe(delay(1000))可以正常工作。

fetchAllSportTypes(): Observable<SportType[]>
{
   return of([{...}, {...}]).pipe(delay(1000))
}

Angular解析器服务内部未触发NGXS ofAction

1 个答案: