current community

your communities

more stack exchange communities

Stack Exchange
tour help
stack overflow careers
Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.
up vote 1 down vote favorite

My directive contains an javascript object. I try to find with jquery all html elements which are binding to this javascript object. How can I get the binded data of the angularjs object with jquery?

Maybe the above code explains better my plan.

angular.module('app').directive('highlight', [
    '$rootScope', '$compile', function ($rootScope, $compile) {
        return {
            replace: true,
            templateUrl: 'highlight.html',
            link: function (scope, element, attrs) {

                //this data object do we need to highlight
                scope.Tohighlight;

                $($.find('input, select')).each(function () {
                    //todo extract data if input or selection are binding data
                    //<input type="x" data-ng-model="data" /></span>
                    var data = angular.extractDataFromhtmlelement($(this));
                    //if html element contains our data add some css stuff
                    if(data ==  scope.Tohighlight)
                    {

                    }
                });
            };
    }
]);

I don't know if there exists an angularjs method for my purpose. How can I get the binded angularjs data model of an jquery object? Thanks.

share|improve this question
    
I have updated my answer stackoverflow.com/a/26578630/947687. Is it helpful for you? –  dizel3d Oct 27 at 8:54

1 Answer 1

up vote 1 down vote accepted

You may do it using scope() method and $parse service. Example

link: function(scope, element) {
    var inputElement = element.find('input');
    var inputModelGetter = $parse(inputElement.attr('ng-model'));
    var inputModelSetter = inputModelGetter.assign;
    function getInputModel() {
        return inputModelGetter(inputElement.scope());
    }
    function setInputModel(value) {
        inputModelSetter(inputElement.scope(), value);
    }
    // ...
}
share|improve this answer
    
Thanks. But with element.find().scope() I do get the viewmodel of the element not the binding object/property. –  Briefkasten Oct 27 at 9:06
    
@Briefkasten, I have updated my answer with $parse service. Think, it is what you want. –  dizel3d Oct 27 at 9:17
    
Thanks for your example. That's exactly what I need. My current problem is that the $parse(boundExpression); expression throws an "TypeError: object is not a function". When I debug the $parse object is available. Do you got any hint? My modify example jsfiddle.net/dizel3d/h5Ls3dbv –  Briefkasten Oct 27 at 10:34
    
@Briefkasten, seems you gave wrong URL to an example. –  dizel3d Oct 27 at 10:36
    
Correct URL jsfiddle.net/28y2rps4 . When the user clicks on the template the setFocus function will be executed. –  Briefkasten Oct 27 at 10:48

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.