0

我对 NgRx 很陌生。我想将值传递给效果。该值是要在服务中搜索的参数。

效果TS文件

export class UsersEffects {
  searchParam: string;
  @Effect()
  users$ = this.actions$.pipe(
    ofType(ActionTypes.SEARCH_USERS),
    map(action => action.payload), //ERROR doesn't recognize payload
    switchMap((payload) =>
      this.githubSearch.getUsers(payload).pipe(
        map(res => new UserActions.GetUsersSuccess(res)),
        catchError(() => of({ type: '[Users API] Users Loaded Error' }))
      )
    )
  );

  constructor(
    private actions$: Actions,
    private githubSearch: GithubSearchService
  ) {}
}

如您所见,我有一个名为 的方法getParam(),它订阅BehavioralSubject包含搜索参数的 a。我无法getParam()在我的效果中调用该方法。还有其他方法吗?还是直接将其Effect从不同的.ts文件传递给?我使用有效载荷吗?

组件 TS 文件

    onSearch(): void {    
     this.githubSearchService.setSearchParam(this.searchForm.value.searchParam);
            this.store.dispatch(new UsersActions.SearchUsers());
            this.searchForm.reset();
     }

减速机TS

 case ActionTypes.SEARCH_USERS:
      return action.payload;

行动 TS

    export class SearchUsers implements Action {
      readonly type = ActionTypes.SEARCH_USERS;
      constructor(public payload: string) {}
    }
4

2 回答 2

2

您将需要使用操作有效负载来实现此目的。

this.store.dispatch(new UsersActions.SearchUsers(searchParam));

然后映射到效果中的动作有效负载。

this.actions$.pipe(
    ofType<SearchUsers>(ActionTypes.SEARCH_USERS),
    map(action => action.payload),
    switchMap((payload) => ...)
于 2019-05-22T03:26:58.360 回答
0
onSearch(): void {    
 this.githubSearchService.setSearchParam(this.searchForm.value.searchParam);
        this.store.dispatch(new UsersActions.SearchUsers());
        this.searchForm.reset();
 }

您没有在操作上发送任何值您的操作想要一个类型为字符串的值

 export class SearchUsers implements Action {
  readonly type = ActionTypes.SEARCH_USERS;
  constructor(public payload: string) {}
}

这是你的动作,它有一个构造函数,并且有一个有效负载,像这样在动作参数上发送值

this.store.dispatch(new UsersActions.SearchUsers(searchParams));

您没有向操作发送任何价值,这就是它无法识别 action.payload 的原因

于 2019-09-04T09:05:30.167 回答