Man*_*ngh 1 javascript angularjs angularjs-directive
我尝试在应用程序中提供两个ng-app,当时我给了两个ng-app
<body>
<div ng-app="A">
<div ng-controller="AC">
</div>
</div>
<div ng-app="B">
<div ng-controller="BC">
</div>
</div>
</body>
然后第二个ng-app不起作用.
但是当我将第一个ng-app ="A"的范围从div更改为body时,两者都可以正常工作
<body ng-app="A">
<div>
<div ng-controller="AC">
</div>
</div>
<div ng-app="B">
<div ng-controller="BC">
</div>
</div>
</body>
任何人都可以让我知道为什么这种行为,因为我对角度很新.我想知道为什么它的工作,因为我没有在第二one.I称为angular.bootstrap试图寻找,但我并没有得到它是如何从DIV改变NG-应用程序的范围,以身体的时候工作.
找到相同的https://jsfiddle.net/maddyjolly2112/wyfd0djp/1/的小提琴,并介意将js复制到同一个.
PS - 如果你们不能回答这个问题,请不要无缘无故地投票
ngApp在实例化多个角度应用程序时不要使用.您无法执行此操作的原因在ngApp指令的文档中列出.
每个HTML文档只能自动引导一个AngularJS应用程序.在文档中找到的第一个ngApp将用于定义作为应用程序自动引导的根元素.要在HTML文档中运行多个应用程序,必须使用angular.bootstrap手动引导它们.AngularJS应用程序不能互相嵌套.
要引导多个Angular应用程序,您必须引用每个应用程序,并且它们在逻辑上不能嵌套或共享元素; 他们需要彼此分开.因此,您无法使用该指令ngApp:
<html>
<head></head>
<body>
<script src="angular.js"></script>
<div id="appElementA"></div>
<div id="appElementB"></div>
<script>
var app = angular.module('A', [])
.controller('AB', function($scope) {
$scope.greeting = 'Welcome!';
});
var appElementA = document.getElementById('divAppA');
angular.bootstrap(appElementA, ['A']);
var bApp = angular.module('B', [])
.controller('BB', function($scope) {
$scope.greeting = 'Welcome to B app!';
});
var appElementB = document.getElementById('divAppB');
angular.bootstrap(appElementB, ['B']);
</script>
</body>
</html>
以上代码将是您为应用程序执行此操作的方式.然后,您必须确保将控制器分配给正确的角度应用程序(在上面的示例中为appvs bApp).
当你嵌套它时你声称它"有效",但是你应该知道它不起作用,它不会崩溃.没有嵌套多个角度应用程序.你会遇到奇怪的问题,特别是如果你有多个名为相同的变量绑定到$rootScope.
如果您打算嵌套两个Angular应用程序; 这是可能的,但非常具体版本,并可能以奇怪的方式打破. 这个Stack Overflow的答案谈到了它.