CODEWITHSUNDEEP
angularjs
user4162403
user4162403

Reputation: 61

angular Error: $compile:multidir

The following code produces Error: $compile:multidir error:

app.controller('myController', ['$scope', function ($scope) {
...
}]);


app.directive('myDirective', ['$window', '$timeout', function($window, $timeout) {
    return {
        restrict: 'A',
        scope: {

        },
        link: function(scope, elem, attrs) {}
...
}]);

the html is as follows:

<div ng-controller="myController" my-directive>
    <div class="index-menu-item" ng-repeat="a in scopeVar">
    </div>
</div>

could you tell what is wrong?

thank you

Upvotes: 2

Views: 1054

Answers (1)

Pankaj Parkar
Pankaj Parkar

Reputation: 136174

You can not have two directive on same tag which are creating child scope, like here ng-controller & my-directive both are placed on same element.

ng-controller directive does create an scope which is prototypically inherited from child scope, It use scope: true

my-directive directive is creating a isolated scope from current scope

Two isolated scope on same element is not possible, you need to either compile one of the directive by setting priority: 1001 to higher priority with terminal: true, terminal : true will ensure that the no other directive will fire after the other.

But doing above things will not work. You need to place you directive inside controller element. That would solve your issue.

Upvotes: 1

Related Questions