Angular ngModel未使用ngFor选择[HTML SELECT INPUT]

Question

https://stackblitz.com/edit/angular-j7iiaw?file=src/app/app.component.ts

The select input is "" instead 1

HTML

<select [(ngModel)]="subcategoria.categoria" class="input-default" name="status_categoria" id="status_categoria">
  <option *ngFor="let categoria of categorias" value="{{categoria.id}}">{{categoria.nome}}</option>
</select>

Typescript

subcategoria: Array<any> = [{
    categoria:1
  }];
  categorias: Array<any> = [{id:1,nome:"one"},{id:2,nome:"two"}];

Answer 1

subcategoria is an Array, I think you want to access subcategoria[0].categoria . Or you need to change the value of subcategoria to

subcategoria = {
    categoria:1
};

This is the working fix

Answer 2

In this, [(ngModel)]="subcategoria.categoria"

subcategoria is an array and not an object

so use [(ngModel)]="subcategoria[0].categoria" for the default value

Answer 3

You are using array as ngModel , so you have to change the ngModel as below,

[(ngModel)]="subcategoria[0].categoria"

Since categoria is the 0th index of the subcategoria array you have to change the ngModel to bind the value

Answer 4

subcategeria is an array so you should address it like this [(ngModel)]=subcategeria[0].categeria 

Or another solution is to change the subcategeria Array to an Object:

subcategoria = {
   categeria:1
};

Answer 5

您需要将subcategoria从数组更改为对象，或者使用arr[index]访问对象