0

I have a view and a controller for it:

<app-head options="options"></app-head>

app.controller('homeCtrl',function($scope){
  $scope.options = {
    first: {
        description: "A link",
        link: "../"
    },
    second:{
        description: "Another link",
        link: "../../"
    }
  };
});

I want to use the object options within my directive:

app.directive('appHead',function(){

  return{
    restrict: 'E',
    templateUrl: 'partials/modules/appHead.html',
    replace: true,
    controller: function($scope,$element,$attrs){
      $scope.options = $attrs.options;
    }
  }
});

When i call console.log($scope.options) in my directive's controller however, it will return options No Properties

Why is that and how do i accomplish this?

user2422960
  • 1,476
  • 6
  • 16
  • 28

1 Answers1

2

Try this

app.directive('appHead',function(){
    return{
        scope: { 
            options: '=', 
        },
        restrict: 'E',
        templateUrl: 'partials/modules/appHead.html',
        replace: true,
        link: function($scope,$element,$attrs){
            // $scope.options 
        }
    }
});

Working Demo

Satpal
  • 132,252
  • 13
  • 159
  • 168
  • Thank you. JHowever, this gives me the exact same result as before. Nevertheless, what is that '=' supoosed to do? And how would i accomplish that without switching to an isolate scope? – user2422960 Nov 19 '13 at 15:33
  • @user2422960, Now You will get value in `$scope.options` See http://stackoverflow.com/questions/14050195/what-is-the-difference-between-and-in-directive-scope – Satpal Nov 19 '13 at 15:34
  • Unfortunately, i ain't. The object has still no properties – user2422960 Nov 19 '13 at 15:38
  • it is still not working. Thanks for your efforts anyways. I believe that the issue lays in the fact that the object is created inside of another controller – user2422960 Nov 19 '13 at 15:48
  • @user2422960, see demo its working, you can see console is populated. You must have error in somewhere else – Satpal Nov 19 '13 at 15:56