使用 http 服务从操作 (NGXS) 中返回一个值

Posted 2023-02-19

【中文标题】使用 http 服务从操作 (NGXS) 中返回一个值

【英文标题】：Return a value from an action (NGXS) with http service

【发布时间】：2020-01-09 15:24:30

【问题描述】：

还有其他更简洁的方法可以通过操作 (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[];

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

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

【问题讨论】：

您能否更清楚地解释您的问题？ > Is there any other more elegant way 是什么？ :) > Is there any other more elegant way to return a value from an http service through an action 回归如何才能“优雅”？干杯:)

您好，@Shadow 感谢您的宝贵时间。假设我的代码中有 8 个操作，它们都返回一个 NotificationResult。我不想存储结果的状态以便能够读取它。我只想在组件上使用直接操作的返回。以这种方式编写（我的示例），我总是需要更新状态才能读取组件中的信息。只是为了能够读取结果。在这个例子中，数据只会被使用一次，它可以被丢弃。

@Shadow 我提到了干净的代码。

我对某些部分感到困惑，我正在解释原因。 > have 8 actions in my code and they all return a NotificationResult 动作不返回任何东西，动作只是命令。我对您的要求和您想要实现的目标并不了解。首先，isLoading 属性也可以存储在状态中并在那里更新，因此您无需在组件中操作此属性。同样store.dispatch当前返回整个状态，在4.0.0版本中将更改为Observable<void>。

我的问题是：你想用isValid返回值做什么？这似乎是可以在动作中处理的事情。如果它是应该出现的消息，它可以由您的状态管理通过调度另一个动作来处理。如果是更新列表，这绝对应该由你的状态管理来处理。参考多个加载状态，使用 NGXS 你可以为每个组件设置子状态：ngxs.io/advanced/sub-states

【参考方案1】：

不将删除结果链接到调度会更干净。而是使用删除方法的当前方法：

调度删除操作 等待操作完成 查看状态的最新值 对此做出反应

你可以：

让 delete 方法调度删除操作 订阅对 $result 的更改（例如，在 init 方法中）并对您获得的更改做出适当的反应

这对我来说似乎更干净。想法？

【讨论】：

感谢您的宝贵时间，@RichDuncan。我相信没有正确的答案。今天很多事情对我来说更清楚了。我只是想找到完美的代码。你的建议是我有一个 insertResult、updateResult、deleteResult，来获取 init 方法以不同方式处理每个操作的最后结果？这是一个替代方案。