Ionic 2, how to use the alert

Question

I am programming using Ionic 2 and I want to show a popup warning when a button is clicked.

This is the code in my home.html:

<button (click)='openFilters()'>CLICK</button>

And in my home.ts

import {Component} from '@angular/core';
import {Page, NavController, Alert} from 'ionic-angular';

@Component({
  templateUrl: 'build/pages/home/home.html'
})
export class HomePage {
  constructor(nav: NavController, alertCtrl: AlertController) {

  }

  openFilters() {
    let alert = this.alertCtrl.create({
        title: 'Low battery',
        subTitle: '10% of battery remaining',
        buttons: ['Dismiss']
    });
    alert.present();
  }
}

I read a few stackoverflow questions on this and tried to implement it like this:

openFilters() {
    let alert:Alert = Alert.create({
        title: 'Low battery',
        subTitle: '10% of battery remaining',
        buttons: ['Dismiss']
    });
    this.nav.present(alert);
  }

I still did not do anything; I get errors.

Answer 1

Be sure to import this:

import {AlertController} from 'ionic-angular';

and have this code:

constructor(private alertController: AlertController) {

}


openFilters() {
    let alert = this.alertController.create({
        title: 'Example',
        subTitle: 'Example subtitle',
        buttons: ['OK']
    });

    alert.present();
}

Everything has changed since Beta 11, and it seems that the documentation on the Internet has not yet been updated, you can always go into the ionic-angular folder in your node_modules and find the component that you are trying to use for examples of better documentation.