# (click) handler on dynamic text

**URL:** <https://forum.ionicframework.com/t/click-handler-on-dynamic-text/97354>\
**Category:** ionic-v3\
**Created:** [July 7, 2017, 4:44pm UTC](https://forum.ionicframework.com/t/click-handler-on-dynamic-text/97354 "2017-07-07T16:44:28Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![OutdoorsBlogger](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/outdoorsblogger/32/107807_2.png) [@OutdoorsBlogger](https://forum.ionicframework.com/u/OutdoorsBlogger)\
**Post date:** [July 7, 2017, 4:44pm UTC](https://forum.ionicframework.com/t/click-handler-on-dynamic-text/97354/1 "2017-07-07T16:44:28Z")

</div>

If somebody could point me in the right direction, it would be hugely appreciated - I’m just not sure what to search for (term, concept, component, etc). And if code snippets, etc., help please let me know.

I’m building in Ionic 3, targeting iOS and Android.

I have a comment list populating from my server via json and would like to embed “links” in those comments that navigate to a separate view with navParams when clicked. For example, there may be hashtags and/or @ mentions in the comment as below:

**Hey @homer check out #simpsons for related information.**

I’ve got the regex to parse these out and format them, but I can’t figure out how to assign an event handler for a click dynamically.

Here’s the function/method that I’m working on, that inserts HTML into the comment. I’m totally fine with doing it another way.

```auto
  formatComment(data) {
    data = data.replace(/#(\S*)/g,'<a href="" (click)="console.log(\'Click Event Fired\')">#$1</a>');
    return this._sanitizer.bypassSecurityTrustHtml(data);
  }

```

Again, thanks so much in advance.

---

<div class="post-metadata">

**Author:** ![philipgriffin](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/philipgriffin/32/110462_2.png) [@philipgriffin](https://forum.ionicframework.com/u/philipgriffin)\
**Post date:** [July 7, 2017, 4:59pm UTC](https://forum.ionicframework.com/t/click-handler-on-dynamic-text/97354/2 "2017-07-07T16:59:16Z")

</div>

You could use a pipe to perform this. If you’re not familiar with pipes [https://www.joshmorony.com/how-to-use-pipes-to-manipulate-data-in-ionic-2/](https://www.joshmorony.com/how-to-use-pipes-to-manipulate-data-in-ionic-2/)

---

<div class="post-metadata">

**Author:** ![rapropos](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/rapropos/32/100227_2.png) [@rapropos](https://forum.ionicframework.com/u/rapropos)\
**Post date:** [July 7, 2017, 8:32pm UTC](https://forum.ionicframework.com/t/click-handler-on-dynamic-text/97354/3 "2017-07-07T20:32:57Z")

</div>

I would use [this strategy](https://forum.ionicframework.com/t/asking-your-advise-about-dynamic-static-loading-components-pages-html/73980/2).

---

<div class="post-metadata">

**Author:** ![OutdoorsBlogger](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/outdoorsblogger/32/107807_2.png) [@OutdoorsBlogger](https://forum.ionicframework.com/u/OutdoorsBlogger)\
**Post date:** [July 9, 2017, 8:24pm UTC](https://forum.ionicframework.com/t/click-handler-on-dynamic-text/97354/4 "2017-07-09T20:24:33Z")

</div>

@philipgriffin Brilliant, many thanks. I’ve actually used one before, and feel like a bonehead for not thinking of it. I’ll try it out and see!

---

<div class="post-metadata">

**Author:** ![OutdoorsBlogger](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/outdoorsblogger/32/107807_2.png) [@OutdoorsBlogger](https://forum.ionicframework.com/u/OutdoorsBlogger)\
**Post date:** [July 11, 2017, 5:55pm UTC](https://forum.ionicframework.com/t/click-handler-on-dynamic-text/97354/5 "2017-07-11T17:55:30Z")

</div>

@rapropos Thanks so much.

In the end, I went a different route. Instead of trying to assign a click handler to particular parts of a returned and displayed string, I actually parsed that string into an array (split by ’ ') and looped through elements with them in the content of a \*ngFor loop. It was straightforward to assign a click event on these, which would just check for it being a hashtag or @ mention and act accordingly.

Great community here, learning a whole lot.
