CODEWITHSUNDEEP
htmlangulartypescript
Lucas
Lucas

Reputation: 25

select angular doesn't show value correctly

I have an array with arrays, which simulate a csv book:

[
  [ 'PROBANDO', 'SUBIENDO DESDE CSV', '1', '900', '', '2', '1' ],
  [ 'PROBANDO', 'SUBIENDO DESDE CSV', '1', '900', '850', '3', '1' ],
  [ 'PROBANDO', 'SUBIENDO DESDE CSV', '1', '900', '850', '2', '1' ]
]

and what I want is to select a category (index 6) and change it in the array.

this code changes the category perfectly, but I have to select a second time for that category I selected to remain selected.

ts

  selectCat(event, idx: any) {
    let prod: any[] = this.productos[idx];

    prod.splice(6, 1, event.target.value); // 6 = posicion de la columna categoria

    this.productos.splice(idx, 1, prod);
  }

html

<tr *ngFor="let p of productos; index as idx">
    <td *ngFor="let i of p; index as ind">

        <p *ngIf="ind <= 4"> {{ i }} </p>

        <select *ngIf="ind == 6" name="cat" (change)="selectCat($event, idx)"
            class="form-control form-control-sm">
            <option *ngFor="let c of categorias" [value]="c.id"> {{ c.categoria }}
            </option>
        </select>

    </td>
</tr>

categorias array:

[
  {id: 2, categoria: "Cat22"},
  {id: 3, categoria: "cat3"},
  {id: 1, categoria: "Ropa"}
]

-----------------------------------------------------------

I put the value selected above the select to verify is correct I put the value selected above the select to verify is correct

what am I doing wrong?

Upvotes: 0

Views: 141

Answers (1)

groetzi
groetzi

Reputation: 198

could you try using [(ngModel)]="p[ind]" instead of (change)="selectCat($event, idx)". i think the data is not correctly bound to the select input. if i understand it correctly, the dropdowns should also show "Ropa" on initial load.

Upvotes: 1

Related Questions