0

Here is a directive that is loading new Template from file:

.directive('candidatesFilter', function(){
    return {
        resctict: 'E',
        replace: true,
        templateUrl: 'views/directives/filters/AAAA.html' 
    }
})

Next HTML-element calls this directive from the other HTML-Template (e.g. xxx.html):

<candidates-filter></candidates-filter>

There is next controller for this parent Template (xxx.html):

app.controller('candidatesController', function($scope, $location ){

    $scope.addPeson = function() {
        $location.url('/candidate/0');
    };

});

Method addPerson() is not accessible inside the Directive's template AAAA.html, because

data-ng-click="addPerson()"

is not working there. How to change the Directive to make addPerson() method available inside the directive's template?

TEMPORARY Solution I fixed this issue by next solution

.directive('candidatesFilter', function(){
    return {
        resctict: 'E',
        replace: true,
        templateUrl: 'views/directives/filters/AAAA.html', 
        controller: function(){
            $('button.add').on('click',function(){
                location.hash = '#/candidate/0';
            });
        }
    }
})

1 Answer 1

0

If I understand the problem correctly:

You can pass a function into the directive for it to use

<candidates-filter></candidates-filter>

becomes

<candidates-filter add-candidate="addPerson()"></candidates-filter>

and the directive definition changed as follows:

.directive('candidatesFilter', function() {
return {
    resctict: 'E',
    replace: true,
    scope: {
        addCandidate: '&addCandidate'
    }
    templateUrl: 'views/directives/filters/AAAA.html'
    link: function(scope, element, attrs) {
        scope.someFunctionInDirective = function() {
            scope.addCandidate();
        }
    };
}
})

Alternatively you can call it with the ng-click like normal from the button

Hope this helps clarify it?

2
  • Could do with a bigger set of information from you so I can see how it's wired up, use the console and do console.log("Hello test") in places to see if it gets called? Oct 23, 2014 at 16:38
  • I fixed the issue in another way. In Directive description i added: controller: function(){ $('button.add').on('click',function(){ location.hash = '#/candidate/0'; }); } Oct 23, 2014 at 16:55

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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