CODEWITHSUNDEEP
angularionic-frameworkionic4
Oscar
Oscar

Reputation: 1

AlertController not working in Ionic 4. Alert is not showing, without any errors

I'm trying to use AlertController in my Ionic 4 App, but there is not working (no alert is shown). the idea is to put an alert (pop-up on the Login button on the Login page) but I can't get it to work, the console.log is displayed, but the alert does not appear

login.module.ts:

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { Routes, RouterModule } from '@angular/router';

import { IonicModule } from '@ionic/angular';

import { LoginPage } from './login.page';
import { RecaptchaModule } from "ng-recaptcha";
import { AlertController } from '@ionic/angular';

const routes: Routes = [
  {
    path: '',
    component: LoginPage
  }
];

@NgModule({
  imports: [
    CommonModule,
    FormsModule,
    IonicModule,
    RouterModule.forChild(routes),
    RecaptchaModule,
  ],
  declarations: [LoginPage],
  providers: [AlertController]
})
export class LoginPageModule {}

login.page.ts:

import { Component, OnInit, NgZone  } from '@angular/core';
import { ToastController, AlertController } from '@ionic/angular';
import { PostProvider } from '../../providers/post-provider';
import { Router } from '@angular/router';
import { Storage } from '@ionic/Storage';
import { Events } from '@ionic/angular';


@Component({
  selector: 'app-login',
  templateUrl: './login.page.html',
  styleUrls: ['./login.page.scss'],
})
export class LoginPage implements OnInit {

async botonPresionado(){
    console.log("estamos presionando el botón");
    const ventana = await  this.alertCtrl.create({  
      header: 'Lowbattery',
      message: 'Do you want to buy this book?',
      buttons: [
        {
          text: 'Aceptar',
        }
      ]
    });
    ventana.present();
  }
}

login.page.html:

<ion-button expand="full" color="tertiary" (click)="botonPresionado()">POP UP</ion-button>

EDIT: I have tried to create a new project, and copy the exact code from the alert and it works fine. I have looked at the version and in the new project I have installed ionic 5. Is it possible that AlertController works with Ionic 5 but not with Ionic 4?

Upvotes: 0

Views: 2103

Answers (1)

enal
enal

Reputation: 43

ion-alert it's working on the ionic 4 and it's working probably you will need to make it like this:


async presentAlert() {
  const alert = await this.alertController.create({
    header: 'Alert',
    subHeader: 'Subtitle',
    message: 'This is an alert message.',
    buttons: ['OK'],
  });

  await alert.present();
  let result = await alert.onDidDismiss();
  console.log(result);
}

you can walk through this documentation about how to implement ion-alert in ionic 4 from here

Upvotes: 3

Related Questions