AngularJS: with one controller

I have a directive that wraps another like this:

<div direction from="origin" to="destination">
    <div direction-map line-color="#e84c3d"></div>
</div>

      

the directive is direction-map

translated, see my code ( Script available here ):

var directionController = function() {
    //do stuffs
};
var directionMapController = function() {
    //do other stuffs
};
var Direction = angular.module("direction", [])
    .controller("directionController", directionController)
    .controller("directionMapController", directionMapController)
    .directive("direction", function() {
        var directive = {
            restrict: "AEC",
            controller: "directionController",
            scope: {},
            transclude: true,
            link: {
                pre: function($scope, $element, attrs, controller, transclude) {
                    console.log("direction controller is directionController : ");
                    console.log(controller.constructor === directionController);//true, that ok
                    transclude($scope, function(clone) {
                        $element.append(clone);
                    });
                }
            }
        };
        return directive;
    })
    .directive("directionMap", function() {
        var directive = {
            require: "^direction",
            controller: "directionMapController",
            restrict: "AEC",
            scope: true,
            link: {
                pre: function($scope, $element, $attrs, controller) {
                    console.log("directionMap controller is directionMapController :");
                    console.log(controller.constructor===directionMapController);//false that not OK!!!!
                }
            }
        };
        return directive;
    });

      

So my question is:

Why direction-map

does my child directive receive its parent's controller as a parameter (I think because it is being translated), can this be avoided or should I just revisit my code?

+3


source to share


1 answer


This is because you use require: "^direction"

, if you remove that line, the directive will get the controller by itself, not the parent.

Hope it helps :)



Updated Fiddle

+1


source







All Articles