# Handling events

**URL:** <https://forum.ionicframework.com/t/handling-events/44189>\
**Category:** ionic-v3\
**Created:** [February 19, 2016, 11:46am UTC](https://forum.ionicframework.com/t/handling-events/44189 "2016-02-19T11:46:04Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![ameni](https://avatars.discourse-cdn.com/v4/letter/a/c2a13f/32.png) [@ameni](https://forum.ionicframework.com/u/ameni)\
**Post date:** [February 19, 2016, 11:46am UTC](https://forum.ionicframework.com/t/handling-events/44189/1 "2016-02-19T11:46:04Z")

</div>

Hello I don’t know how to add a click event to a component. Can anyone help me  
thank you 😌

---

<div class="post-metadata">

**Author:** ![nitishrajput01](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/nitishrajput01/32/123978_2.png) [@nitishrajput01](https://forum.ionicframework.com/u/nitishrajput01)\
**Post date:** [February 19, 2016, 12:26pm UTC](https://forum.ionicframework.com/t/handling-events/44189/2 "2016-02-19T12:26:54Z")

</div>

@ameni

ng-click directive is used in angularjs to handle click event  
try like this in your template

```
<div ng-click = "click_me()">

</div> 

```

and In Controller handle this click event

```
$scope.click_me = function(){

alert('Hello');

}
```

---

<div class="post-metadata">

**Author:** ![ameni](https://avatars.discourse-cdn.com/v4/letter/a/c2a13f/32.png) [@ameni](https://forum.ionicframework.com/u/ameni)\
**Post date:** [February 19, 2016, 12:29pm UTC](https://forum.ionicframework.com/t/handling-events/44189/3 "2016-02-19T12:29:14Z")

</div>

thank you but I am using ionic 2  
events are handled in another way I suppose

---

<div class="post-metadata">

**Author:** ![nitishrajput01](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/nitishrajput01/32/123978_2.png) [@nitishrajput01](https://forum.ionicframework.com/u/nitishrajput01)\
**Post date:** [February 19, 2016, 12:42pm UTC](https://forum.ionicframework.com/t/handling-events/44189/4 "2016-02-19T12:42:11Z")

</div>

@yep but u tagged ionic not ionic2

---

<div class="post-metadata">

**Author:** ![ameni](https://avatars.discourse-cdn.com/v4/letter/a/c2a13f/32.png) [@ameni](https://forum.ionicframework.com/u/ameni)\
**Post date:** [February 19, 2016, 12:47pm UTC](https://forum.ionicframework.com/t/handling-events/44189/5 "2016-02-19T12:47:19Z")

</div>

yes you are right 😌

---

<div class="post-metadata">

**Author:** ![nitishrajput01](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/nitishrajput01/32/123978_2.png) [@nitishrajput01](https://forum.ionicframework.com/u/nitishrajput01)\
**Post date:** [February 19, 2016, 12:54pm UTC](https://forum.ionicframework.com/t/handling-events/44189/6 "2016-02-19T12:54:27Z")

</div>

i think it’s like this in ionic2

`<button (click)="clicked()">Click</button>`

```
@Component(...)
class MyComponent {
  clicked(event) {
  }
}
```

---

<div class="post-metadata">

**Author:** ![ameni](https://avatars.discourse-cdn.com/v4/letter/a/c2a13f/32.png) [@ameni](https://forum.ionicframework.com/u/ameni)\
**Post date:** [February 19, 2016, 1:23pm UTC](https://forum.ionicframework.com/t/handling-events/44189/7 "2016-02-19T13:23:22Z")

</div>

hello thank you for helping me  
I didn’t understand too much  
I guess pages in ionic2 are considered as components.

**Here is my HTML code containing only one button**

```
<ion-content padding class="page1">
<button secondary (click)="clicked()">Secondary</button>
</ion-content>

```

**Here is my script**

import {Page} from ‘ionic/ionic’;

@Page({  
templateUrl: ‘build/pages/page1/page1.html’  
})  
export class Page1 {  
constructor() {

}

}

Where can I add the function clicked()  
Thank you 🙂

---

<div class="post-metadata">

**Author:** ![Tommertom](https://avatars.discourse-cdn.com/v4/letter/t/ed8c4c/32.png) [@Tommertom](https://forum.ionicframework.com/u/Tommertom)\
**Post date:** [February 19, 2016, 2:32pm UTC](https://forum.ionicframework.com/t/handling-events/44189/8 "2016-02-19T14:32:34Z")

</div>

```
import {Page} from 'ionic/ionic';

@Page({
templateUrl: 'build/pages/page1/page1.html'
})
export class Page1 {
constructor() {

}

clicked() { 
      console.log('CLICKED!!'); 
 }

}
```

---

<div class="post-metadata">

**Author:** ![ameni](https://avatars.discourse-cdn.com/v4/letter/a/c2a13f/32.png) [@ameni](https://forum.ionicframework.com/u/ameni)\
**Post date:** [February 19, 2016, 3:00pm UTC](https://forum.ionicframework.com/t/handling-events/44189/9 "2016-02-19T15:00:18Z")

</div>

Ok thank you very much 😁