¿Cómo comparar 2 conjuntos de objetos y cuando el valor coincide, entonces se marca la casilla de verificación de material angular? por ejemplo: en este caso, el objeto operator coincide con la casilla de verificación para el operador

app.ts

const arr1 = [ 
   { 
      "id":"1",
      "name":"operator"
   },
   { 
      "id":"2",
      "name":"admins"
   },
   { 
      "id":"3",
      "name":"client"
   },
   { 
      "id":"4",
      "name":"developer"
   }
]
const arr2 = [ 
   { 
      "id":"1",
      "name":"operator"
   },
   { 
      "id":"3",
      "name":"client"
   }
]

this.arr1.forEach(a1Obj => {
    this.arr2.some(a2Obj => {
        if (a2Obj.id === a1Obj.id) {
            console.log(a1Obj);
        }
    })
});

app.html

<div class="col" *ngFor="let group of groups; let i = index">
    <mat-checkbox value="group.id" [labelPosition]="'after'" [checked]="true" (change)="assignGroups($event, group.id)">
        {{ group.name }}
    </mat-checkbox>
</div>
1
SKL 19 dic. 2019 a las 17:33

2 respuestas

La mejor respuesta

Puede agregar una matriz en la que empujará los valores comunes y luego comprobará cada vez si el grupo actual existe en commonArray utilizando la función isCommonElt:

archivo TS

commonArray = [];
this.arr1.forEach(a1Obj => {
  this.arr2.some(a2Obj => {
    if (a2Obj.id === a1Obj.id) {
      console.log(a1Obj);
      this.commonArray.push(a1Obj);
    }
  })
});

isCommonElt(id: any): boolean {
  return this.commonArray.some(elt => elt.id === id);
}

archivo HTML

<div class="col" *ngFor="let group of groups; let i = index">
    <mat-checkbox value="group.id" [labelPosition]="'after'" [checked]="isCommonElt(group.id)">
        {{ group.name }}
    </mat-checkbox>
</div>
1
ic_paty 19 dic. 2019 a las 17:54

Intenta como a continuación,

archivo .ts

const arr1 = [ 
   { 
      "id":"1",
      "name":"operator"
   },
   { 
      "id":"2",
      "name":"admins"
   }
];
const arr2 = [ 
   { 
      "id":"1",
      "name":"operator"
   },
   { 
      "id":"3",
      "name":"client"
   }
];

isEnableCheckbox: boolean = false;

constructor() {
  this.isEnableCheckbox = this.checkIsObjectIsEqual();
}

checkIsObjectIsEqual() {
    // The below resultArray will give the common objects from the both comparing arrays
    let resultArray = this.array1.filter(a1Obj => {
        return this.array2.some(a2Obj => {
            return a2Obj.id === a1Obj.id;
        });
    });

    if (resultArray.length > 0) {
        return true;
    } else {
        return false;
    }
}

archivo .html

<mat-checkbox [checked]="isEnableCheckbox">some label</mat-checkbox>
0
Gangadhar Gandi 19 dic. 2019 a las 14:59