As far as creating and using the alert goes, that’s all I’m doing. Could anything else make a difference in the creation and destruction of alerts?
More interestingly, however, every time I try to trigger a new alert by the appropriate dom event and user action, a new alert does come up but then ionic displays that error message anyway. Once I click on close at the top right of the error (modal?) to dismiss the error, the newly created alert is still there and I can interact with it just fine.
I’d rather not post all of my code for the page since it’s a lot of code; but the gist of it is here.
Also, I’d like to try to debug my own code than ask someone to do it for me.
You might be treating alert creation as synchronous, when it is actually asynchronous. Here’s a related method in an AlertManager provider I wrote. You’ll see that I am explicitly managing the Promise of displaying the alert.
I tried the change in implementation of the AlertController to no effect. I was under the impression that the alert is properly disposed of by Ionic when the user taps one of the buttons?
I get the feeling I may be missing something obvious. On the other hand, I wonder if how I create and present the controller might really be the issue since the error message implies something was trying to remove an alert which was already removed earlier.
Finally, the docs mention no special treatment in the case of multiple calls to the AlertController.
To be honest, at this point I’m at a loss to find out what’s going wrong.
Eventually. Very little is instantaneous in web programming. Somewhere, you are assuming things happen faster than they really do.
Edit: Look at it this way. if you are not defining dismiss handlers, and if the word “then” appears nowhere in your code to handle Promise resolution, then you’re doing it wrong. You need at least one of those two approaches.
This is really a strange error. One thing I noticed is the lack of a role being attached to your button. Shot in the dark, but maybe
buttons: [{ text: 'OK', role: 'cancel' }]
could possibly be a solution. I’ve never run into a problem but I use a method similar to @AaronSterling in that I return alert.present() as Promise<any>
That way I can reference this.myAlert at other points in my component, outside of the function that is responsible for presenting it (I dont do this often, just special use cases)
I don’t know how I could make use of the alert function with an asynchronous signature; I wanted to say it earlier but I call the alert through another function which runs when the user clicks something.
So, if I did this.showAlert("msg", "subtitle").then(_ => {}) or the like, the promise resolution would be part of the instance which was called on the first click. I’m not sure how I could carry over the resolution into future calls of my other function.
Finally, the demo source page for the alert controller shows no asynchronous handling of the controller and I can call the alert several times on the components page in the docs just fine.
Yes, I’ve tried all of those caveats to no effect. (So sad )
This really is unusual. Also, as I pointed out to @AaronSterling, the demo source page for the alert controller shows no such special love and care for promise resolution. (Again, so sad )
Also, please reference my latest response to Aaron, as it contains more information.
The alert API clearly shows that alert.present returns a Promise. It isn’t the fault of the intro docs that you are using alerts in an advanced, nonstandard way.
I’m guessing so too. I’ve used AlertController without returning a promise (as you are doing) and didn’t have any issues. In those cases, I wasn’t doing anything complicated whatsoever though.
Must be interacting strangely with some other code.
Granted I didn’t look the code over with a fine-tooth comb
You guys won’t believe what was causing the problem.
I was calling a Loading instance from the LoadingController as well before the program determined whether it was appropriate to show the alert. Right before the alert was to be displayed, I dismissed the loader to show the alert.
I removed my call to the LoadingController entirely and now everything works fine. (Masaka!)
This was really unexpected and I would have never imagined that this would be an issue.
I made sure I was handling the dismissal of the loader asynchronously and then showing the alert but that didn’t help either.
All said and done, I’m glad I could figure out what was causing the issue but I just wish it wasn’t so obscure.
Well, at least it got me to look at the page class, which is something I was putting off
Yes, my alert was presented as part of the promise resolution for the loader.
On the promise resolution for the alert, there was nothing to do, so the function calling it exited.
I don’t have the dismissOnPageChange option set, nor do I use the loader or alert on any lifecycle event. Also, any execution path which leads to the loader being dismissed and the alert being shown doesn’t trigger a page change. These were the paths I was testing when I found the error.
I don’t want to jump the gun here, but maybe this could be a bug?