title: How to change click function based on button class in Angular
body: <p>In Angular I have a button which toggles a class - What I want to do is add events based on the button class. Should this be done via an <code>If</code> statement within a function? So far my code is below:</p>
  
  <p><strong>HTML button</strong></p>
  
  <pre><code>&lt;!-- toggle button --&gt; 
  &lt;button type="button" class="btn btn-primary mt-3 ml-3 btn-button" (click)="status=!status; func()" [ngClass]="{'btn-danger' : status, 'btn-primary' : !status}"  [disabled]="clicked"&gt;{{status ? 'Delete' : 'Add'}}&lt;/button&gt;
  &lt;!-- toggle button --&gt;
  </code></pre>
  
  <p><strong>Component.ts</strong></p>
  
  <pre><code>import { Component } from '@angular/core';
  
  @Component({
    selector: 'my-app',
    templateUrl: './app.component.html',
    styleUrls: ['./app.component.css']
  })
  
  export class AppComponent {
  
  public btn: any;
  
  func () {
     if (this.btn.hasClass('btn-primary')) {
        alert('Primary clicked');    
     } else if (this.btn.hasClass('btn-danger')) {
       alert('Danger clicked');    
     }
   }
  }
  </code></pre>