在第三方框架中，可以通过提供将由框架添加到窗口加载的 JavaScript 代码来修改 html 页面。可以将它们的内容写入 AddIn div 元素。
我如何将角度应用程序注入到这个 div 元素（HTML + js）中。
<!DOCTYPE html>
<html>
<head>
<script src="http://apps.bdimg.com/libs/angular.js/1.4.0-beta.4/angular.min.js"></script>
<script src="http://code.jquery.com/jquery-2.1.4.min.js"></script>
<link rel="stylesheet" href="style.css" />
<script type="text/javascript">
window.onload=function() {
//todo add js code here
}
</script>
</head>
<body>
<div id="AddIn"></div>
</body>
</html>
我可以添加html
$('#AddIn').append("<div ng-app='dropboxApp' ng-controller='dropboxController as dropbox'>{{dropbox.label}}</div>");
但我不确定在哪里添加我的角度初始化代码，并使事情正常工作
angular.module('dropboxApp', [])
.controller('dropboxController', function () {
var dropbox = this;
dropbox.label = 'hello angular';
});
您可以在页面上延迟初始化您的应用程序，而不是使用ng-app页面上的指令。 html 注入后，您可以使用以下命令在页面上初始化角度angular.bootstrap方法基本上需要DOM& 然后在数组内部它需要模块名称。
执行此操作时，您需要在角度参考之后在页面本身上添加所有角度组件文件。它们应该在您之前初始化bootstrap页面上的应用程序。
window.onload=function() {
$('#AddIn').append("<div ng-controller='dropboxController as dropbox'>{{dropbox.label}}</div>");
//add angular html first
//then run angular on the page using angular.bootstrap.
angular.bootstrap($('#AddIn'), ['demo']);
}
Note：在 Angular 之前加载 jQuery 以获取 jQuery 编译的 DOM，而不是获取 jQLite 编译的 DOM。
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
