Question

我有一个状态选择器和以下操作

@Selector()
public static employees(state: EmployeeSearchStateModel) {
    return state.employees;
}

@Action(FetchEmployees)
getEmployees({ getState, setState }: StateContext<EmployeeSearchStateModel>) {
    const state = getState();
    this.employeeService.getEmployees().pipe(tap((res: EmployeeSearch) => {
        setState({
            ...state,
            loading: false,
            employees: res.userData
        });
    }));
}

现在，在组件中，我想将其与异步管道一起使用，但是它不起作用。组件声明如下：

@Select(ManageEmployeeSearchState.employees) employees$: Observable<EmployeeI[]>;

ngOnInit(){
    this.store.dispatch(new FetchEmployees());
}

在HTML中，当我尝试打印<pre>{{ employees$ | async | json }}</pre>时，它不起作用。我看不到调用的后端API。

但是，如果我将pipe and tap替换为subscribe，则一切正常。但是我不想订阅吗？

请问有什么线索吗？

Answer 1

如果您在状态中使用pipe运算符而不是调用订阅，则需要将Observable返回给NGXS，以便框架为您订阅：

@Action(FetchEmployees)
getEmployees({ getState, setState }: StateContext<EmployeeSearchStateModel>) {
    const state = getState();
    return this.employeeService.getEmployees().pipe(tap((res: EmployeeSearch) => {
        setState({
            ...state,
            loading: false,
            employees: res.userData
        });
    }));
}

不订阅动作ngxs

1 个答案: