Showing/Hiding Ion Card programmatically


This is probably a simple problem but it’s defeating me at the moment.

I’m monitoring the closing of the InAppBrowser with this code:

this.browser.addEventListener( "exit", this.clearIntervalCheck.bind(this) );

In the function, I’m clearing a setInterval routine (for which I need to bind this) and trying to show a hidden ion-card.

<ion-card id="saveMessageCard" [hidden]="NoTaskSaved"> <h3 id="saveMessage">Target saved in memory, press save to customize and return task to the server</h3> <button class="pathfinder-btn" (click)="saveTask()">Save</button> <button class="pathfinder-btn" (click)="cancelTask()">Cancel</button> </ion-card>

However, when I set the variable to false in the function with this line of code:

this.NoTaskSaved = false;

The card does not show. The variable is changing as expected. I have also used this method to show html on a click. Here I am doing it programmatically and the behaviour does not seem the same.

I have a feeling that the binding of ‘this’ to the function is causing this problem, but I can’t clear the interval without the binding so I’m a bit stuck. Anyone got any ideas? I’d love some help.