为什么一次同时使用一个ng-app？

Question

I have 2 div each applied with a ng-app . 我有2 div每个应用ng-app 。 But it is strange, that only one ng-app is working at a time. 但是奇怪的是，一次只运行一个ng-app 。 When I run the following : 当我运行以下命令时：

<html>
<body>
<script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/angularjs/1.2.29/angular.min.js'></script>
    <div ng-app='myApp'>
        <span ng-controller="textController">{{greetMessage.ny}}</span>
    </div>  

    <div ng-app='transactionStatus'>
        <p ng-controller="transactionStatusController">
            <em>Hello&nbsp;{{transactionDetails.completeName}}</em> <br />
            Your current status: {{transactionDetails.statusText}}
        </p>
    </div>  

    <script>
        var myappModule = angular.module('myApp',[]);

        myappModule.controller('textController',function($scope) {
            var greetMessage = {};
            greetMessage.ny = 'Hey! Happy new year.';
            $scope.greetMessage = greetMessage;
        });

        var transactionStatusModule = angular.module('transactionStatus',[]);
        transactionStatusModule.controller('transactionStatusController',function($scope){
            var transactionDetails = {};
            transactionDetails.completeName = 'Brian Silas';
            transactionDetails.statusText = 'Confirmed';
            $scope.transactionDetails = transactionDetails;
        });
    </script>

</body>

the output is: 输出为：

Hey! Happy new year.
Hello {{transactionDetails.completeName}} 
Your current status: {{transactionDetails.statusText}}

But if I remove the the div with ng-app , it works as expected and the output is : 但是如果我用ng-app删除div，它可以按预期工作，并且输出为：

Hello Brian Silas 
Your current status: Confirmed

What could be the reason for this? 这可能是什么原因？

Answer 1

Angular bootstraps only the first found application. Angular Bootstrap仅引导第一个找到的应用程序。 More details here . 更多细节在这里。

To have more than one application you need to manually bootstrap the second one: 要拥有多个应用程序，您需要手动引导第二个应用程序：

angular.element(<your element>).ready(function() {
  angular.bootstrap(<your element>, ['transactionStatus']);
});

为什么一次同时使用一个ng-app？

问题描述

1 个解决方案

解决方案1
2 已采纳 2016-01-01 14:07:27

为什么一次同时使用一个ng-app？

问题描述

1 个解决方案

解决方案1 2 已采纳 2016-01-01 14:07:27

解决方案1
2 已采纳 2016-01-01 14:07:27