CODEWITHSUNDEEP
angularjsangularjs-directive
ZNS
ZNS

Reputation: 850

How do I access ng-controller from directive?

I've written my own directive from which I want to call a method on the parent ng-controller. I've tried doing that by adding require:'ngController' in my directive. However the returned controller is just an empty object. I'm running 1.4.8.

<div ng-controller="myController">
  <div my-directive></div>
</div>

app.directive('myDirective', function() {
  return  {
    restrict: 'A',
    scope: false,
    require: '^ngController',
    link: function (scope, $element, attrs, controller) {
      //controller is empty object..
    };
  }
});

Update: My misstake was that I added a method to the controllers scope when I should add it directly to the controller instead.

app.controller('myController', function($scope) {
 $scope.myMethod = function() {}; //Not callable from controller passed to directive
 this.myMethod = function() {}; //IS callable from controller passed to directive
});

Upvotes: 0

Views: 174

Answers (2)

koralarts
koralarts

Reputation: 2112

You can call the parent controller via scope if your directive doesn't have an isolated scope, and you don't need to require ngController.

angular.module('app', [])
  .controller('controller', function($scope) {
    $scope.greet = function() {
      return 'hi'
    };
  })
  .directive('testDirective', function() {
    return {
      restrict: 'E',
      template: '<h1>{{ greet() }}</h1>'
    };
  });

Output:

hi

Plnkr: http://plnkr.co/edit/uGXC5i1GjphcZCPDytDG?p=preview

Upvotes: 1

Maess
Maess

Reputation: 4166

The function needs to be available in the directive's scope. So if your directive is in the scope of the controller it is:

scope.fn();

Upvotes: 0

Related Questions