Weedoze Weedoze - 2 months ago 16
AngularJS Question

Custom directive scope element visible but undefined

I made a custom directive that retrieves data from a controller.

My variable is visible inside the scope element but when trying to access it, I got undefined

HTML

<map borders="vm.borders"></map>


Directive

angular.module('myApp.directives')
.directive('map', [ function() {
return {
restrict: 'E',
scope: {
borders: '='
},
link: function(scope, element, attrs) {
console.log(scope); //cfr linked image
console.log(scope.borders) //undefined
}
}
}]);


Here is the scope. It contains the borders variable.

scope console

What am I missing to retrieve this borders value ?

Answer

I could suggest to add an ng-if to the directive, because for example if vm.borders are got from a promise, ng-if is required:

<map borders="vm.borders" ng-if="vm.borders"></map>