node.js - 如何等待发货完成后再从商店挑选。 Ngrx相关问题

标签 node.js angular ngrx ngrx-effects ngrx-store-4.0

如何才能等待发货完成后再从商店进行选择。谷歌搜索没有运气?这种情况下,我该如何等待发货完成后再去商店挑选呢?

我的代码,感谢支持的帮助。

**team-list.component.ts**

 teamsState: Observable<{teams: Team[]}>;

  constructor(private store: Store<fromApp.AppState>) { }

  ngOnInit() {
    this.store.dispatch(new TeamActions.GetTeams({
      search: this.search,
      limit: this.limit,
      skip: this.skip,
      sortBy: this.sortBy
    }));
    this.teamsState = this.store.select('teams');
  }
**team-list.component.html**

<mat-expansion-panel
    *ngFor="let team of (teamsState | async).teams; let i = index">
    <mat-expansion-panel-header>
      <div class="container-fluid">
        <div class="row">
          <div class="col-md-1">{‌{ i+1 }}</div>
          <div class="col-md-1">
              <div class="post-image">
                <img [src]="imageUrl+team.imagePath" [alt]="team.name" style>
              </div>
          </div>
          <div class="col-md-10"> {‌{ team.name }} </div>
        </div>
      </div>
    </mat-expansion-panel-header>
effects
@Effect() // If you do not want to dispatch any actions, if need to modify store state then remove
    teamList = this.actions$.pipe(
        ofType(TeamActions.GET_TEAMS),
            map((action: TeamActions.GetTeams) => {
              return action.payload;
            }),
            switchMap((params: {search: string, limit: number, skip: number, sortBy: string}) => {
                return this.httpClient.get<Team[]>(
                  `${BACKEND_URL}?search=${params.search}&&limit=${params.limit}&&skip=${params.skip}&&sortBy=${params.sortBy}`);
            }),
            map((teams: Team[]) => {
                return {
                    type: TeamActions.SET_TEAMS,
                    payload: teams
                };
            }),
            catchError((err, caught) => {
              // console.log(err.error.errors);
              this.snackBarService.showSnackBar('Unable to Get Teams', true);
              return caught;
            })
        );

当前在第一次加载期间,当我从商店中选择商品时,调度操作尚未完成。目前为空。

最佳答案

你不能,调度就像一场火灾,忘记你不能等待。

幸运的是,这不是必需的,因为 this.store.select('teams') 是一个可观察对象。 这意味着如果它发生变化,observable 将发出一个新值,这将导致您的组件重新渲染。

如果列表为空,您可以检查您的状态是否确实已更新,这可以通过@ngrx/store-devtools来完成。 。如果状态已更新但未显示在组件中,请确保您没有直接修改状态,而是创建对数组的新引用。

关于node.js - 如何等待发货完成后再从商店挑选。 Ngrx相关问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55354139/

相关文章:

javascript - FFMPEG 需要 3 分钟生成缩略图

Angular 9 : ngcc failing to run

c# - Angular 6 中的 cors 策略已阻止从源访问 xmlhttprequest

javascript - MatSelect 打开时如何滚动底层 MatDialog?

angular - NGRX:TypeError:操作必须具有类型属性

angular - @ngrx 4.x 中的错误 : No Provider for Store!

node.js - 在 Google App Engine 上运行的 NextJs 应用程序的正确配置是什么?

javascript - 如何在html中的函数内部调用函数?

javascript - 如何使用 Express 在 Node.js 中打印响应主体(或 POST 时的请求主体)?

javascript - switchMap 由 RxJs 中的属性区分