select dynamic options do not set values angular 14

Question

I have a configuration array list of my list of roles and groups with their respective values correctly.

but the iterated values are correct and the ones that are displayed in the select are the first of my "configuration" array

   <div class="container">

           <div class="row" *ngFor="let item of configuracion; let i = index">
             <div class="col-lg-5" >
               <label for="nombre" class="col-form-label">grupo {{item.id_group}}</label>
               <select class="form-select" name="uno" [(ngModel)]="item.id_group">
                 <option *ngFor="let objGrupo of lstGrupos" [value]="objGrupo.id">{{objGrupo.name}}</option>
               </select>
             </div>
           <div class="col-lg-5" >
             <label for="nombre" class="col-form-label">Rol {{item.id_role}} </label>
             <select class="form-select" name="dos" [(ngModel)]="item.id_role">
               <option *ngFor="let objeto of lstRoles" [value]="objeto.id">{{objeto.name}}</option>
             </select>
           </div>
           <div class="col-lg-2" style="display: flex; align-items: flex-end;">
             <button class="btn btn-rounded btn-danger"  type="button" >
               <i class="bi bi-trash-fill"></i>
               eliminar
             </button>
           </div>
         </div>
       </div>

typescript:

  ngOnInit(): void {
    this.configuracion.push(
      {id:0, id_group: Number(101), id_perfil:0, id_role: Number(204)},
      {id:0, id_group: Number( 104), id_perfil:0, id_role: Number( 305)}
    )
  }

even next to role and group the ids are set correctly but on select it doesn't show what is the value string of the id

I try with select to match when the id of my "configuration" array is equal to the id of my list of groups and the same with my list of roles

 <div class="col-lg-5" >
                <label for="nombre" class="col-form-label">grupo {{item.id_group}}</label>
                <select class="form-select" name="uno" [(ngModel)]="item.id_group">
                  <option *ngFor="let objGrupo of lstGrupos" [value]="objGrupo.id" [selected]="item.id_group==objGrupo.id">{{objGrupo.name}}</option>
                </select>
              </div>

select dynamic options do not set values angular 14

0 Answers0