当另一个模态关闭时,如何打开角度2材料模态

时间:2018-10-25 16:24:37

标签: angular angular-material2

我有一个名为medicoesSelecionadas的列表,我需要使用列表中的每个元素打开一个模式,但是代码只能在关闭前一个模式时打开另一个模式。

我尝试了以下代码:

this.medicoesSelecionadas.forEach(medicao => {
  let historicoEmpreiteiro;
  this.loading = true;
  console.log(' ENTORU AQUI ')
  this.medicaoEmpService.ObterHistoricoEmpreiteiro(medicao.id)
    .subscribe(result => {
      this.loading = false;
      historicoEmpreiteiro = result;
      const refDialog = this.dialog.open(DescontoEmpreiteiroComponent, {
        data: { historicoEmpreiteiro: JSON.stringify(historicoEmpreiteiro) }
      });

      refDialog.afterClosed().subscribe(r => {
        console.log('Entrou closed');
      });

    });
    console.log(' ENTORU ALI ')
});

但是问题是,foreach同时打开所有模态

1 个答案:

答案 0 :(得分:1)

假设:this.medicoesSelecionadas是一组对象

只要this.medicoesSelecionadas数组不是很长,我可能会通过递归来解决。假设上面的代码在一个名为“ existingFunc()”的函数内,我将执行以下操作:

existingFunc() {
    this.recursiveFunc(this.medicoesSelecionadas);
}

recursiveFunc(medicoesSelecs: Array<Object>) { // replace this type with the correct one
    if (medicoesSelecs.length > 0) {
        let medicao = medicoesSelecs.shift(); // remove first item from array
        let historicoEmpreiteiro;
        this.loading = true;
        console.log(' ENTORU AQUI ');
        this.medicaoEmpService.ObterHistoricoEmpreiteiro(medicao.id)
            .subscribe(result => {
                this.loading = false;
                historicoEmpreiteiro = result;
                const refDialog = this.dialog.open(DescontoEmpreiteiroComponent, {
                    data: { historicoEmpreiteiro: JSON.stringify(historicoEmpreiteiro) }
                });

                refDialog.afterClosed().subscribe(r => {
                    console.log('Entrou closed');
                    this.recursiveFunc(medicoesSelecs); // call self with remaining array
                });
            });
        console.log(' ENTORU ALI ');
        }
    }
}

这会产生一些开销,因为所有函数都将保留在堆栈中,直到最后一个函数最终关闭为止,因此您需要注意不要以太大的数组开头。