Wsrtjtyk

i have this select:

Template:

<div class="select">

  <select (change)="getIdTipoVariacao(item.value.tipo)" formControlName="tipo" class="select-text">

    <option class="dropdown-item" selected>{{item.value.tipo || 'Tipo da Variação'}}</option>

    <option [hidden]="item.value.tipo == tipoVariacao.valor" *ngFor="let tipoVariacao of tiposvariacoes;let j = index"

      class="dropdown-item">{{tipoVariacao.valor}}</option>

  </select>





  <span class="select-highlight"></span>

  <span class="select-bar"></span>

</div>

In my component, throught the function getIdTipoVariacao() i catch the id of my "variacao" selected:

getIdTipoVariacao(variacao:string) { // take the id of one "tipo de variação" to send to function get-lista-valor-atributo to get the list of attributs of my "variation":

    for(let i=0;i<this.tiposvariacoes.length;i++){

      if(this.tiposvariacoes[i].valor == variacao){

        this.idTipoVariacao = this.tiposvariacoes[i].id

      }

    }

this.listaValoresAtributo(this.idTipoVariacao);

}



  listaValoresAtributo(id: number){

    console.log(id)

    this.tipoProdutoService.listaValoresAtributo(id)

      .pipe(

        take(1)

      )

      .subscribe((res) => {

        console.log(res);

        this.listaAtributos = res.data.valores_atributos;

        this.loadingfiltro = false;

      },

        (err: HttpErrorResponse) => {



          if (err.status == 401) {

            this.authService.Logout();

          }



          if (err.error.data.erro) {

            this.toastrService.showToast(false, 'Ops, temos um problema', err.error.data.erro);

          } else {

            this.toastrService.showToast(false, 'Ops, temos um problema', 'Entre em contato com o suporte!');

          }

        })

  }

Everythings work well, this function take the id of my variation and send to my backend, that me returns an array (this.listaAtributos), i have to copulate the other select.

In my second select i do one ngfor trying to copulate the options according the answer of my server, but no one data is copulate. If i print a console.log in this.listaAtributos, i see my array with my data that i need to coppulate. How can i do this?

My second select:

      <div class="col-md-2">

        <div class="select">

          <select formControlName="valor" class="select-text">

            <option class="dropdown-item" selected>{{item.value.valor || 'Valor'}}</option>

            <option *ngFor="let ValorAtributo of listaAtributos;let x = index"

              class="dropdown-item">{{ValorAtributo.valor}}</option>

          </select>





          <span class="select-highlight"></span>

          <span class="select-bar"></span>

        </div>



      </div>

Observables? Someone can teach me?