TypeScript：触发动作的 NgRx 效果

Question

我是 NgRx 的新手，我的大部分代码都运行良好，但我被困在这个特定的代码上，我需要你的帮助。

当登录效果被触发并成功发送到 LoginSuccess 时，我正在尝试保存到本地存储并触发另一个操作。

下面是我的示例代码

效果

    @Effect({ dispatch: false })
    LogInSuccess$: Observable<any> = this.actions$.pipe(
        ofType<businessActions.LogInSuccess>(
            businessActions.AuthActionTypes.LOGIN_SUCCESS
        ),
        map((action: businessActions.LogInSuccess) => {
            localStorage.setItem('token', JSON.stringify(action.payload));
            this.navCtrl.navigateRoot('/home');
        }), map(
            () => new businessActions.LoadBiz()
        )
    );

Answer 1

根据您的 cmets 和代码，我推测您正尝试根据某些服务 (LoginService) 的响应来实现某些 UI 行为。该代码适用于图书馆或服务。但是在某些时候你需要知道结果，在某些时候你需要 subscribe() 到你正在创建的 observable 才能知道它的结果

最后拨打subscribe()。否则你的 observable 将永远不会实现。

更新

除了subscribe() 调用之外，您还需要导航到/home url，然后在处理该路由的组件中加载您的业务：new businessActions.LoadBiz()

你的代码在我看来应该是这样的：

@Effect({ dispatch: false })
LogInSuccess$: Observable<any> = this.actions$.pipe(
    ofType<businessActions.LogInSuccess>(
        businessActions.AuthActionTypes.LOGIN_SUCCESS
    ),
    map((action: businessActions.LogInSuccess) => {
        localStorage.setItem('token', JSON.stringify(action.payload));
    })
).subscribe(() => this.navCtrl.navigateRoot('/home'));

那么无论你在哪里处理/home 路由，在组件new businessActions.LoadBiz() 或更好的init() 方法中，将businessActions 逻辑提取到服务中，注入服务并调用：businessActions.LoadBiz() 不需要然后在你的 UI 中调用new。