javascript - ng-click not working in font-awesome icon - Stack Overflow

admin管理员组

文章数量:1315941

I have added my demo to: this link When I click on thumbs up (es from fontawesome) ng-click does not trigger and like count does not change. When I click to xyz, like count increases.

This is not working:

<i ng-click="LikeComment(ment)" class="far fa-thumbs-up"></i> {{ment.like}} 

But this is working:

<i ng-click="LikeComment(ment)">xyz</i> {{ment.like}}

I have added my demo to: this link When I click on thumbs up (es from fontawesome) ng-click does not trigger and like count does not change. When I click to xyz, like count increases.

This is not working:

<i ng-click="LikeComment(ment)" class="far fa-thumbs-up"></i> {{ment.like}} 

But this is working:

<i ng-click="LikeComment(ment)">xyz</i> {{ment.like}}

• javascript
• angularjs
• font-awesome

Share Improve this question Follow asked Mar 2, 2018 at 13:31 Enes KöroğluEnes Köroğlu 18455 silver badges1616 bronze badges 2

• You should wrap icons with actions in a button: <button ng-click="LikeComment(ment)"><i class="fa fa-thumbs-up"></i></button – devqon Commented Mar 2, 2018 at 13:36
• 1 <div ng-click="LikeComment(ment)"><i class="far fa-thumbs-up"></i> {{ment.like}}</div> div will make it as well ;p – Vossen Commented Mar 2, 2018 at 13:38

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 6

Try this:

<span ng-click="LikeComment(ment)"><i class="far fa-thumbs-up"></i></span>{{ment.like}}

OR, in case you are ok with a button

<button ng-click="LikeComment(ment)"><i class="far fa-thumbs-up"></i></button>{{ment.like}}

Font awesome turns it into a <svg> tag which doesn't seem to collaborate too well with the click handler. Try wrapping the <i> in a <div> like this

https://jsfiddle/wewekvkw/26/

本文标签： javascriptngclick not working in fontawesome iconStack Overflow