Angular 指令 - 要求嵌入? [英] Angular directive - asking for transclusion?
本文介绍了Angular 指令 - 要求嵌入?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我在下面收到一个错误,我不明白为什么.有什么想法吗?
html,
<button ng-click="loadForm()">加载指令表单</button><div data-my-form></div>
角度,
app.directive('myForm', function() {返回 {替换:真,控制器:功能($范围){$scope.isLoaded = false;$scope.loadForm = function(){$scope.isLoaded = true;}},模板:'<div ng-if="isLoaded" ng-include="\'form.php\'" ></div>',链接:功能(范围,元素){}}});
错误,
错误:[$compile:multidir] 多个指令 [ngInclude, ngInclude] 要求嵌入:<div data-my-form="" ng-if="isLoaded" ng-include="'form.php'">
修复,
'<div><div ng-if="isLoaded" ng-include="\'form.php\'" ></div></div>'
但是为什么我必须将它包装在一个 div 中?这是一个角度错误吗?
解决方案
错误很明显.在试图使用嵌入的同一元素上有两个指令:
<代码>1.ng-if2. ng-包含
一个元素只能应用一个嵌入.
要解决此问题,请改为尝试:
<div ng-include="'form.php'">
I get an error below 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) {
}
}
});
error,
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 have to wrap it in a div? is it a angular bug?
解决方案
The error is clear. There are two directives on the same element that is trying to use transclusion:
1. ng-if
2. ng-include
An element can only apply one transclusion.
To fix, try this instead:
<div data-my-form="" ng-if="isLoaded">
<div ng-include="'form.php'"> </div>
</div>
这篇关于Angular 指令 - 要求嵌入?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文