如何使用 ionic 2 框架在警报框中显示选定的索引值答案

【问题标题】：How to display selected index value in alert box using ionic 2 framework如何使用 ionic 2 框架在警报框中显示选定的索引值
【发布时间】：2017-12-16 17:43:08
【问题描述】：

我正在尝试在 ionic 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 作为删除函数的参数传递给我需要在警报框中显示的相同值。

【问题讨论】：

为什么在删除方法中no 周围有花括号？
我不需要在警告框中显示任何值
那么就连接它，不需要放花括号。

标签： javascript angular typescript ionic2 angular2-template

【解决方案1】：

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

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');
        });

【讨论】：