我可以选择:
模板:
<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>
在我的组件中,通过函数getIdTipoVariacao(),我捕获了所选择的“ variacao”的ID:
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!');
}
})
}
一切正常,该函数获取我的变体的ID并发送到我的后端,我返回一个数组(this.listaAtributos),我必须补全其他选择。
在我的第二个选择中,我尝试根据服务器的答案来填充选项,但是没有一个数据被填充。如果我在this.listaAtributos中打印console.log,我将看到包含我需要处理的数据的数组。我该怎么办?
我的第二选择:
<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>
可观察物?有人可以教我吗?