Angular directive - transition request?
I am getting below error and I don't understand why. Any ideas?
HTML,
<button ng-click="loadForm()">Load Directive Form</button>
<div data-my-form></div>
angular,
app.directive('myForm', function() {
return {
replace:true,
controller:function($scope){
$scope.isLoaded = false;
$scope.loadForm = function(){
$scope.isLoaded = true;
}
},
template: '<div ng-if="isLoaded" ng-include="\'form.php\'" ></div>',
link:function(scope, element) {
}
}
});
mistake,
Error: [$compile:multidir] Multiple directives [ngInclude, ngInclude] asking for transclusion on: <div data-my-form="" ng-if="isLoaded" ng-include="'form.php'">
a fix,
'<div><div ng-if="isLoaded" ng-include="\'form.php\'" ></div></div>'
but why do I need to wrap it in a div? is this an angular bug?
+3
source to share
1 answer
The error is understandable. There are two directives for the same element that the transition is trying to use:
1. ng-if
2. ng-include
An element can only apply one exception.
To fix the error, try this instead:
<div data-my-form="" ng-if="isLoaded">
<div ng-include="'form.php'"> </div>
</div>
+8
source to share