How can I get word selection event in AngularJS

Question

I am building an application in which user can select a word from the article displayed on a webpage, I save that word in the database for later use.

Which event can I use so that I can get which word the user has selected. I am using AngularJS. Below is a code which I found in jQuery, how can I write equivalent AngularJS code

$(document).ready(function() {

    var p = $('p');
    p.css({ cursor: 'pointer' });

    p.dblclick(function(e) {
        var range = window.getSelection() || document.getSelection() || document.selection.createRange();
        var word = $.trim(range.toString());
        if(word != '') {
            alert(word);
        }
        range.collapse();
        e.stopPropagation();
    });

});

You may want to look at how to write directives and well events are all the same, angular is just another javascript framework. — PSL
– PSL, Commented Nov 2, 2014 at 18:36

Ilan Frumer · Accepted Answer · 2014-11-02 19:56:11Z

1

You just need to wrap it inside a directive:

app.directive('p', function() {
  return {
    restrict: 'E',
    link: function(scope, element, attrs) {
      element.css({ cursor: 'pointer' });
      element.on('dblclick', function(e) {
        var range = window.getSelection() || document.getSelection() || document.selection.createRange();
        var word = range.toString().trim();
        if(word !== '') {
          console.log(word);
        }
        e.stopPropagation();
      });      
    }
  }
});

answered Nov 2, 2014 at 19:56

Ilan Frumer

32.4k8 gold badges73 silver badges84 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How can I get word selection event in AngularJS

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related