Mam selektor sklepu NGRX:

export const selectActivePracticeUsersListSnapshot = pipe(
  select(selectPracticeUsersList),
  filter((users) => !!users),
  take(1),
  map((users) => users.filter((user) => user.active))
);

Mam usługę, która jest wstrzykiwana w wielu elementach zawierających następującą metodę:

public getTeamMembersWithAccess(permission: string): string[] {
  let flagAvatars: string[];
  this.store.dispatch(loadUsers());
  this.store.pipe(selectActivePracticeUsersListSnapshot).subscribe((activePracticeUsers) => {
    flagAvatars = activePracticeUsers.reduce((teamMembers, activeUser) => {
      if (!!activeUser.permissions[permission]) {
        const { firstName, lastName } = activeUser;
        return [...teamMembers, `${firstName} ${lastName}`];
      }
      return teamMembers;
    }, []);
  });
  return flagAvatars;
}

Dzwonię do tego z mojego komponentu:

constructor(private helperService: HelperService) {
  const flagAvatars = this.helperService.getTeamMembersWithAccess('AdminPage');
}

Mój problem polega na tym, że metoda usług zwraca niezdefiniowany z powodu flagavatars: ciąg []; przed subskrypcją do selektora sklepu powraca, ponieważ czeka na wysyłkę Loadusers () do zakończenia. Wiem, że muszę zmienić metodę getteammberswithAccess () <) , aby zwrócić obserwowalny, string [] & gt; jakoś, ale nie jestem pewien, jak to napisać. Próbowałem wielu rzeczy, ale nie mogę tego zrobić dobrze. Całkiem pewny, że muszę użyć mapy zamiast subskrypcji, ale po prostu nie możesz dowiedzieć się, jak to pisać.

0
mycroft16 8 październik 2020, 01:32

1 odpowiedź

Najlepsza odpowiedź

Jesteś całkowicie ze swoim oświadczeniem, pomogę ci w tworzeniu betonu.

Spróbuj tego:

Usługa:

import { map } from 'rxjs/operators';
......
public getTeamMembersWithAccess(permission: string): Observable<string[]> {
  this.store.dispatch(loadUsers());
  this.store.pipe(selectActivePracticeUsersListSnapshot).pipe(
   map((activePracticeUsers) => {
    // flagAvatars equals this, so let's just return it right away in the map
    return activePracticeUsers.reduce((teamMembers, activeUser) => {
      if (!!activeUser.permissions[permission]) {
        const { firstName, lastName } = activeUser;
        return [...teamMembers, `${firstName} ${lastName}`];
      }
      return teamMembers;
    }, []);
   });
  )
}

Aby go spożywać:

this.helperService.getTeamMembersWithAccess('AdminPage').subscribe(data => {
  console.log(data);
});
1
AliF50 7 październik 2020, 23:48