离子组件“alertcontroller”上的双向数据绑定

时间:2018-03-13 19:27:55

标签: javascript typescript ionic-framework handle

是否有可能在离子警报控制器中进行双向数据绑定?,我尝试了不同的方法而且我没有成功,尝试在文本输入中添加处理程序但我不能,我想知道是否有任何获取alertcontroller的输入更改的函数。 请帮助。

let prompt = this.alertCtrl.create({
          title: 'VALORES DE LA ENTRADA',
          message: "INGRESE EL COSTO, EL IVA, EL DESCUENDO Y LA CANTIDAD",
          inputs: [
            {
              name: 'costo',
              label: 'COSTO: ',
              placeholder: 'COSTO',
              value: (productData[0].costo).toString().match(/^-?\d+(?:\.\d{0,2})?/)[0]
            },
            {
              name: 'iva',
              label: 'IVA: ',
              placeholder: 'IVA',
              value: iva
            },
            {
              name: 'descuento',
              placeholder: 'DESCUENTO',
              value: descuento
            },
            {
              name: 'cantidad',
              placeholder: 'CANTIDAD',
              value: cantidad
            }
          ],
          buttons: [
            {
              text: 'Cancelar',
              handler: data => {
                console.log('Cancel clicked');
              }
            },
            {
              text: 'Aceptar',
              handler: data => {
                costo = data.costo;
                iva = ((costo) - (descuento))* 0.16;
                descuento = data.descuento;
                cantidad = data.cantidad;
                cantidadEq = cantidad * this.valorEq;
                var costoTotal = costo * cantidad;
                var total = (costoTotal + (iva*cantidad)) - descuento;
              }
            }
          ]
        });
        prompt.present();

1 个答案:

答案 0 :(得分:1)

没有简单的方法可以在AlertController中对输入进行双向数据绑定甚至更改处理程序。 AlertController适用于简单的用例。

根据AlertController docs

  

如果您需要一个不符合警报准则的复杂表单UI,我们建议您在模式中构建表单:

这可以通过以下方式实现:

let formModal = this.modalCtrl.create(MyCustomFormComponent);

其中MyCustomFormComponent是具有表单和双向绑定的组件。

在这个答案中,您可以找到如何从模态中获取数据的示例:Ionic 2 - Get data back from modal