ionic 3 - Runtime Error function not defined - ReferenceError: function is not defined at HTMLButtonElement.onclick

Question

I have a button for which I defined a doLogout function for the onclick property, but everytime I click on that button the following error is shown:

Runtime Error function not defined - ReferenceError: function is not defined at HTMLButtonElement.onclick

The code is very simple, and I used it in other pages, where the function is called correctly. This is my HTML file:

<ion-header>  
  <ion-navbar>
    <ion-title>Logout</ion-title>
  </ion-navbar>
</ion-header>

<ion-content>
  <div padding>
  <button ion-button block onclick="doLogout()">Logout</button>
 </div>  
   </ion-content>

And this is the ts file:

export class LogoutPage {

  constructor(public navCtrl: NavController, public navParams: NavParams,
  public api : Api) {
  }


  doLogout(){
       //does something
  }

}

Answer 1

Ionic2/3 is built on top of Angular2/4 (or just Angular) so the correct way to use the click event would be:

<button ion-button block (click)="doLogout()">Logout</button>

You can find more information in Angular docs