Receive a status and mark as CHECKED - Typescript

Asked

Viewed 36 times

0

I am receiving an array from the back, containing the system users. I display this array on a group edit screen, where it displays all system users in a Multiple checkbox.

What I need to do and am not succeeding: when displaying the checkbox with all users of the system, I would like those who are already part of this group to appear as checked, while those who do not belong, do not.

Through a route, I have access to all group information, including which users are part of it.

How can I compare the array of users that are part of the group with the array of all system users, marking as checked when they are equal?

How I get the array of all system users:

this.groupService.getPermissions().subscribe(
        (result: Permissions[]) => {
          this.listaPermissions = result;
          console.log(result);
          },
        (err) => {console.log(err); }
      );

HTML

<!-- EXIBE LISTA DE USUÁRIOS -->
    <mat-form-field>
      <mat-select id=arrayUser placeholder="Usuários"
      matNativeControl multiple>
        <mat-option [value]="item.ID_PROFH" *ngFor="let item of arrayUser; let i=index" 
        (onSelectionChange)="changeArrayIDUser(i, item.ID_PROFH, $event)">{{item.USERNAME}}</mat-option>
      </mat-select>
    </mat-form-field>
typescript angular-material

  • Lucas, there are various algorithms for this. But in principle to follow the business logic and make the computer execute the routine you have it run, make a loop of type "for" or "foreach" in the received items array comparing what you received with what is to come and then you make the additions and "checked" manually if match in your comparison.

2 answers

0

The idea would be to put a property [checked]="userChecked" or something that comes from the backend saying that this user has been checked, then you put it to this, or you can use the reactive Forms follows this example of some checkebox...

0

this.arrayDeTodosOsUsuarios.forEach(userGeral => {
this.arrayUsuariosGrupo.forEach(userGrupo => {
if(userGeral.id === userGrupo.id) { // Certifica se é o mesmo usuário nos dois arrays.
userGeral.valorCheckBox = userGrupo.valorCheckBox; // Valor booleano do checkbox, [checked]
}
});
});

There are other ways to do this, but I believe that this should supply your need, anything comments there that we are working on. I don’t know if this is the most optimized way to do it. Maybe with a . find() in the arrayUsuariosGroup gets better.

Browser other questions tagged typescript angular-material

You are not signed in. Login or sign up in order to post.