angular - 使用 http 服务从操作 (NGXS) 返回值

Question

还有其他更干净的方法可以通过操作 (NGXS) 从 http 服务返回值吗？或者我们应该总是更新“结果”状态只是为了在您返回时进行咨询？

下面的代码有效，非常接近文档。
但是，对我来说似乎不是很干净。

export class DeleteAction {
  static readonly type = '[Test] Delete';
  constructor(public id: number) { }
}

@State<TestStateModel>({
  name: 'test',
  defaults: {
    result: null
  }
})
export class TestState {

  constructor(
    private testService: TestService) {
  }

  @Selector()
  static getResult(state: TestStateModel): NotificationResult {
    return state.result;
  }

  @Action(DeleteAction)
  public delete({ patchState }: StateContext<TestStateModel>, { id }: DeleteAction) {
    return this.testService
      .delete(id)
      .pipe(
        take(1),
        tap(result => {
          patchState({ result });
        })
      );
  }

@Component({
  templateUrl: './test.component.html'
})
export class TestComponent {

    @Select(SubjectState.getResult) result$;

    private delete(id: number): void {
    this.isLoading = true;
    this.store.dispatch(new DeleteAction(id))
      .pipe(withLatestFrom(this.result$))
      .subscribe(([_, r]) => {
        const result = r as NotificationResult;
        if (result.isValid) {
          // ...
        } else {
          // ...
        }
        this.isLoading = false;
      });
  }
}

export interface NotificationResult {
  isValid: boolean;
  messages: NotificationMessage[];
}

由于除了调用“删除”方法之外我不会使用“结果”，因此似乎没有必要为此目的创建状态。

还有其他更优雅的方式吗？

Answer 1

不将删除结果链接到调度中会更清晰。而是具有删除方法的当前方法:

调度删除操作

等待操作完成

从状态看最新值

对此使用react

你可以:

让 delete 方法调度删除操作

订阅对 $result 的更改(例如在 init 方法中)并对您获得的更改做出适当的 react

这对我来说似乎更清洁。想法？