為什么一次同時使用一個ng-app？

Question

我有2 div每個應用ng-app 。 但是奇怪的是，一次只運行一個ng-app 。 當我運行以下命令時：

<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>

輸出為：

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

但是如果我用ng-app刪除div，它可以按預期工作，並且輸出為：

Hello Brian Silas 
Your current status: Confirmed

這可能是什么原因？

Answer 1

Angular Bootstrap僅引導第一個找到的應用程序。 更多細節在這里。

要擁有多個應用程序，您需要手動引導第二個應用程序：

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