我有 2 个不同的 AngularJs 模块：一个 widgetContainer 和一个 widget。
小部件可以显示为独立的应用程序，也可以包含在小部件容器中。一个 widgetContainer 包含 0-N 个 widget。
如果我尝试将小部件模块引导到小部件容器中，角度会抛出以下错误：
错误：[ng:btstrpd] 应用程序已使用此元素“
”进行引导http://errors.angularjs.org/1.5.8/ng/btstrpd?p0=%26lt%3Bdiv%20id%3D%22childApp%22%26gt%3B http://errors.angularjs.org/1.5.8/ng/btstrpd?p0=%26lt%3Bdiv%20id%3D%22childApp%22%26gt%3B
我已重现此错误这个笨蛋 http://plnkr.co/edit/PBIyADrP0VpbDBBfen1b?p=preview
<div id="parentApp">
<div ng-controller="MainParentCtrl">
Hello {{name}} !
<div id="childApp">
<div ng-controller="MainChildCtrl">
Hello {{childName}} !
</div>
</div>
</div>
EDIT :
使用依赖注入可以有效地解决问题。
现在，我需要从指令加载小部件。
parentApp.directive('widget', [function() {
return {
restrict: 'E',
link: function($scope, $element, $attr) {
var div = document.createElement('div');
div.setAttribute("ng-controller", "MainChildCtrl");
div.innerHTML = 'Hello {{childName}} !';
$element.append(angular.element(div));
}
};
}]);
div 已创建，但 childApp 模块未加载到内部。
我已经更新了我的plunker http://plnkr.co/edit/PBIyADrP0VpbDBBfen1b?p=preview
