Search code examples
javascriptionic-frameworkionic4

Ionic-4 ion-alert-controller create function not working

I am using Ionic with vanila java script I am using CDN in head component

<script type="module" src="https://cdn.jsdelivr.net/npm/@ionic/core/dist/ionic/ionic.esm.js"></script>
<script nomodule src="https://cdn.jsdelivr.net/npm/@ionic/core/dist/ionic/ionic.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ionic/core/css/ionic.bundle.css"/>

In the body of HTML

<ion-alert-controller></ion-alert-controller>
......
.....
<script src="app.js"></script>

in app.js

const alertCtrl = document.querySelector('ion-alert-controller');
..
..
..
alertCtrl.create ({
                message: 'ABC',
                header: 'DEF',
                button: ['Okay']
            });

getting an error saying

app.js:29 Uncaught TypeError: alertCtrl.create is not a function at HTMLElement. (app.js:29)

Solution

  • I'm not used to code with vanilla, but according to Ionic docs for js, you should use alertController this way :

    const alertCtrl = document.querySelector('ion-alert-controller');
alertCtrl.message ='ABC';
alertCtrl.header='DEF';
alertCtrl.button= ['OK'];