javascript - Filtrera resultat om de har en grupp inställd

Jag har en lista över tjänstanvändare med ID:n som jag vill filtrera bort från söklistan om de redan finns i en grupp-tabell.

Det finns 2 tabeller involverade - för det första 'group-user' - som inkluderar groupId och serviceUserId, den andra tabellen är 'group' och den har groupId och groupName.

När funktionen addUserToGroupModal anropas vill jag bara visa namn som inte har någon grupp tilldelad.

påInIt kallas funktionen listGroups för att hämta alla grupper och användare inom gruppen -

async listGroups() {
 await Promise.all([
  this.groupService.getGroups(true).then((result) => (this.groups = [...result])),
  this.userService.getActiveAndInHospitalServiceUsers(false).then((result) => (this.serviceUsers = [...result])),
  this.groupService.getGroupUsers(true).then((result) => (this.groupUsers = [...result]))
]).then(() => {
  this.groupMap.clear();
  this.groupIdMap.clear();
  this.groups.forEach((group) => {
    const idsForUsersInGroup = this.groupUsers.filter((groupUser) => groupUser.groupId === group.id).map((groupUser) => groupUser.serviceUserId);
    const usersInGroup = this.serviceUsers.filter((serviceUser) => idsForUsersInGroup.includes(serviceUser.id));
    this.groupIdMap.set(group.id, group.name);
    this.groupMap.set(group.name, {id: group.id, users: usersInGroup});
  });
 });
}

När modalfunktionen anropas behöver jag att filtret tillämpas för att endast visa serviceUsers som inte har en grupp.

async addUserToGroupModal(template: TemplateRef<any>) {
  this.addUserRef = this.modalService.show(template, {class: 'modal-lg', backdrop: 'static', keyboard: false});
}

Jag använder en datalista för att visa användarna -

<datalist id="groupSelect">
    <option *ngFor="let serviceUser of serviceUsers"
            [value]="serviceUser.id"
    >
      {{serviceUser.firstName}} {{serviceUser.lastName}}
  </datalist>

Svar #1

Du kan lägga till en extra variabel usersWithAGroup som kommer ihåg alla användare som faktiskt är tilldelade en grupp :

let usersWithAGroup = [];
this.groups.forEach((group) => {
  const idsForUsersInGroup = this.groupUsers.filter((groupUser) => groupUser.groupId === group.id).map((groupUser) => groupUser.serviceUserId);
  Array.prototype.push.apply(usersWithAGroup, idsForUsersInGroup );
  const usersInGroup = this.serviceUsers.filter((serviceUser) => idsForUsersInGroup.includes(serviceUser.id));
  this.groupIdMap.set(group.id, group.name);
  this.groupMap.set(group.name, {id: group.id, users: usersInGroup});
});

Sedan i din html filtrerar du om användaren inte finns i usersWithAGroup :

<datalist id="groupSelect">
  <option *ngFor="let serviceUser of serviceUsers"
        [value]="serviceUser.id">
  <span *ngIf="!usersWithAGroup.includes(serviceUser.id)">{{serviceUser.firstName}} {{serviceUser.lastName}}</span>
</datalist>