如何使用离子2框架在警报框中显示所选索引值

时间:2017-07-12 10:32:57

标签: javascript angular typescript ionic2 angular2-template

我正在尝试在离子2警告框中显示选定的索引值。但我没有正确的方法如何在离子提示中显示。

这是 home.ts

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import {AlertController} from 'ionic-angular';

@Component({
 selector: 'page-home',
 templateUrl: 'home.html'
})
export class HomePage {
companies: Array< {name: string, code: number}>
 constructor(public navCtrl: NavController, public alertController:  
 AlertController) {
    this.companies = [
        {name: 'Microsoft', code: 1},
        {name: 'Apple', code: 2},
        {name: 'Google', code: 3},
        {name: 'Oracle', code: 4},
        {name: 'IBM', code: 5},
    ];
}

delete(no) {
    let alert = this.alertController.create({
        title: "Example",
        subTitle: "Example SubTitle" + {{no}};
        buttons: ["OK"]
    });

    alert.present();
    (this.companies).splice(no, 1);
  }

}

在上面的删除功能delete(no)中,我将no作为删除功能的参数传递给我需要在警告框中显示的相同值。

1 个答案:

答案 0 :(得分:0)

很高兴为此创建共享提供程序。

<强> shared.provider.ts:

  public Alert = {
    confirm: (msg?, title?, no?) => {
      return new Promise((resolve, reject) => {
        let alert = this._alert.create({
          title: title || 'Confirm', //  `Example SubTitle ${no}`
          message: msg || 'Do you want continue?',
          buttons: [
            {
              text: 'Cancel',
              role: 'cancel',
              handler: () => {
                 reject(false);
              }
            },
            {
              text: 'Ok',
              handler: () => {
                resolve(true);
              }
            }
          ]
        });
        alert.present();
      });

    },
    alert: (msg, title?) => {
      let alert = this._alert.create({
        title: title || 'Alert',
        subTitle: msg,
        buttons: ['Dismiss']
      });

      alert.present();
    }
  }

调用提醒确认:

     import { SharedProvider } from '../../providers/shared.provider';
     this.shared.Alert.confirm('Would you like to delete?', 'Confirm', 2).then((response) => {
          console.log('confirmed');
        }, err => {
          console.error('rejected');
        });