Home Angular 8 Angular 9 – Multiple types of click events

Angular 9 – Multiple types of click events

by therichpost
0 comment
Angular 9, Angular 10

Hello to all, welcome again on therichpost.com. In this post, I will tell you, Angular 9 – Multiple types of click events.

Post Working:

In this post, I will show you multiple types of click events like click function with parameters etc.

Here is the code and please use carefully:

1. Here is the code for app.component.ts file:


export class AppComponent implements OnInit {
  nameDynamic = "Therichpost";

  //Simple Click Function
  alert("click me clicked!!");

  //Click Function with event trigger
    alert(event); //Mouse click event

  //Click Function with Dynamic Parameter value

  //Click Function with Multiple Parameters values
  clickme4(event, name)
  alert('Name= ' + name);




2. Here is the code for app.component.html file:

<!-- I have added Bootstrap 4 so I am adding bootstrap 4 classes -->

<button class="btn btn-primary" (click) = "clickme()">Simple Click Function</button>

<button class="btn btn-primary" (click) = "clickme2($event)">Click Function with Parameter</button>

<button class="btn btn-primary" (click) = "clickme3(nameDynamic)">Click Function with Dynamic Parameter</button>

<button class="btn btn-primary" (click) = "clickme4($event, nameDynamic)">Click Function with Multiple Parameter</button>


If you have any kind of query then pleaes do comment below.


Thank you

You may also like

Leave a Comment

This site uses Akismet to reduce spam. Learn how your comment data is processed.