当接口在NGXS状态下成功时，如何关闭MatDialogBox或任何div？

How to close MatDialogBox or any div when API is successful in NGXS state?(当接口在NGXS状态下成功时，如何关闭MatDialogBox或任何div？)

问题描述

我已经开始学习使用NGXS进行状态管理。到目前为止，一切都很好，但对一些情况没有什么问题，比如-

1. 如果Mat对话框(或任何div-我在这里有项目中的两个方案)处于打开状态，并且从其中调用了API，则仅当API返回成功时，我如何才能关闭该对话框？

2. 假设用户注销，如何将状态重置为默认值？

下面第一种情况是我的状态代码，action&；Dispatcher：

abc.action.ts

export class AddExamCategory {
    static readonly type = '[ExamCategory] Add';
    constructor(public payload: ExamCategory) {}
}

abc.state.ts

export interface ExamCategoryStateModel {
    examCategoryList: ExamCategory[];
}

@State<ExamCategoryStateModel>({
    name: 'examCategory',
    defaults: {
        examCategoryList: []
    }
})

@Injectable()
export class ExamCategoryState {

    constructor(private _adminService: AdminService) {}

    @Action(AddExamCategory)
    addExamCategory({ getState, patchState }: StateContext<ExamCategoryStateModel>, { payload }: AddExamCategory) {
        return this._adminService.createExamCategory(payload).pipe(tap(response => {
            patchState({ examCategoryList: [] }); // Want to close the modal/div after this part. If API returns ERROR do not close.
        }));
    }
}

abc.Component.ts

this.store.dispatch(new AddAdminUser({ ...this.adminRegistrationForm.value, password: this.password.value }))
    .subscribe(response => {
      this.store.dispatch(new GetAdminUsers());
      this.dialogRef.close(true)
    });

目前是这样，但无论接口处于什么状态都会关闭。

对于第二种情况，在我为logout()编写逻辑的服务中，我编写了如下内容：this.store.reset({})。虽然它正在重置状态，但不是使用其中的默认值。我要在此单一注销方法上重置多个状态。

如何处理这些方案？

推荐答案

要实现这一点，最简单的方法是在您发送操作后，您应该能够触发其他操作(如UsserAddedSuccessful&Quot；)，并在关闭该模式后阅读它。

阅读此question了解更多详细信息。

这篇关于当接口在NGXS状态下成功时，如何关闭MatDialogBox或任何div？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持编程学习网！