philomath
philomath

Reputation: 2211

How to use isolate scope inside directive's controller?

I have something very simple, similar like below. My question is how to make the isolate scope available inside the directive's controller: (For a full jsbin version, click here!)

app.directive("data", function() {
  return {
    restrict: "E",
    template: "<div>My Data</div>",
    scope: {
      myData : '='
    },
    require: "data",
    controller: function(){
      this.logData = function(){
        console.log(scope.myData);
      }
    },
    link:function(scope,element,attrs,ctrl){
      console.log(scope.myData); //works!
      ctrl.logData(); //scope is not defined
    }
  }
})

Upvotes: 0

Views: 401

Answers (2)

Federico Viotti
Federico Viotti

Reputation: 69

You can use the bindToController property to bind declared properties in isolate scope directly to controller instance used inside the directive. Follow an example of DDO object inside directive function declaration:

var ddo = {
templateUrl: 'example.html',
scope: {
  articles: '<',
  title: '@'
},
controller: ExampleDirectiveController,
controllerAs: 'myCtrl',
bindToController: true

};

The bindToController setted true allow you to use isolate scope properties (in this case articles and title) directly inside your controller.

Upvotes: 0

Shomz
Shomz

Reputation: 37701

You need to pass in the scope reference, just like with the regular controllers. Here's a quick example:

controller: function($scope){
  this.logData = function(){
    console.log($scope.myData);
  }
},

http://plnkr.co/edit/oossm0g48PnPc3e89P2v?p=preview

Upvotes: 1

Related Questions