Как ждать завершения отправки, прежде чем выбрать из магазина.Ngrx связанная проблема - PullRequest
Новая
       41

Как ждать завершения отправки, прежде чем выбрать из магазина.Ngrx связанная проблема

0 голосов
/ 26 марта 2019

Как я могу ждать завершения отправки, прежде чем выбрать из магазина. Не везет в Google? В таком случае, как мне дождаться отправки, прежде чем выбрать из магазина?

Мои коды, спасибо за помощь. 

**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;
            })
        );

В настоящее время во время первой загрузки диспетчерское действие еще не завершено, и когда я выбираю товар из магазина. В настоящее время он пуст.

1 Ответ

0 голосов
/ 26 марта 2019

Вы не можете, отправка - это пожар, и забудьте, что вы не можете ждать.

К счастью, это не нужно, потому что this.store.select('teams') является наблюдаемым. Это означает, что если оно изменится, наблюдаемое будет выдано новое значение, и это приведет к повторному рендерингу вашего компонента.

Если список остается пустым, вы можете проверить, действительно ли обновлено ваше состояние, это можно сделать с помощью @ ngrx / store-devtools . Если состояние обновлено, но оно не отображается в компоненте, убедитесь, что вы не изменяете состояние напрямую, а создаете новую ссылку на массив.

...