AngularJS - Not able to get value from factory service -

i new in angularjs , due facing issue , not able understand exact problem. code tried worked in normal javascript code want use custom service (factory function). actually, have textarea user can input text , can formating selecting of text. (discovertheweb.in/woweditor - existing site have created want apply angular in code). now, have created custom service check whether user select content or not. have used below code in custom services , try selection start, end point can selected text textarea field. but, problem getting 0 value both selection start , end point. when used same code inside directive works try value through service showing 0 both. please find below code , let me know code missed out here.

custom service:

(function(){ "use strict"; var wsapp = angular.module("workapp"); wsapp.factory("inputcheckservice", function(){     var defaulttext = document.getelementbyid("input-text-area");                        var selstart = defaulttext.selectionstart;     var selend =  defaulttext.selectionend;     var selectedtext;     if(selstart != selend){         selectedtext = defaulttext.value.substring(selstart, selend);                                 }else{         selectedtext = null;     }     return {                     selstart: selstart,         defaulttext: defaulttext,         selend: selend,         selectedtext: selectedtext     }; });     

}());

the directive called services. included service inside main controller in different file.

(function(){ "use strict"; var wsapp = angular.module("workapp"); wsapp.directive("generaldirective", generaldirective); function generaldirective(){     return {         scope: true,         controller:function($scope, inputcheckservice){             $scope.collapsed = false;             $scope.collpasepanel = function(){                 $scope.collapsed = !$scope.collapsed;             };             $scope.updatepara = function(){                 alert(inputcheckservice.defaulttext+"selection start: "+inputcheckservice.selstart+" selection end: "+ inputcheckservice);                 /**                  * defaulttext: defaulttext,                     selstart: selstart,                     selend: selend,                     selectedtext: selectedtext                  */             }         },         templateurl: 'directive/general-directive.html'     }; }     

}());

if need more details, please let me know.

thanks in advance time , suggestion.

regards, robin

you should not use service manipulate dom element. should manipulate dom @ directives. problem dont have anywhere listen textarea selection event , service not update data inside. have created fiddle problem. watchselection directive based on answer stackoverflow. should notice :

1. i use service store data. selstart, selend or paragraphcontent , provide api retrieve data

   .factory("inputcheckservice", function () {         return {                setselstart: function (start) {                     selstart = start;                },                .....         }, }); 

2. on watchselection directive, watch mouseup event , perform update service store value need , later can retrieve other directives or controllers.

   elem.on('mouseup', function () {      var start = elem[0].selectionstart;      //store service     inputcheckservice.setselstart(start); }); 

3. in generaldirective directive can value service , angular auto update view you.

hope helps.