搜尋

首頁  >  問答  >  主體

angular.js - angular.module中模組的名字一定要跟ng-app屬性的值一樣嗎

例如ng-app="app",如果angular.module("app",[]);中的名字不定義為"app"的話會報錯。

PHPzPHPz2814 天前1069

全部回覆(5)我來回復

  • 怪我咯

    怪我咯2017-05-15 17:09:57

    ng-app 是整個angular應用的入口,他會根據ng-app指定的名稱去尋找對應的angular模組,如果不一致就無法找到對應的模組進行初始化。所以應用的根模組名稱必須和ng-app指定的名稱一致

    回覆
    0
  • 大家讲道理

    大家讲道理2017-05-15 17:09:57

    ng-app 是整個應用程式的入口,所以必須和入口的module名稱一致,一個應用程式只能有唯一一個ng-app

    回覆
    0
  • 習慣沉默

    習慣沉默2017-05-15 17:09:57

    一個angular應用中,可以有多個angular.module。應該有且只有一個angular.module的名稱與ng-app的值一致,否則就沒有意義了。

    angular.module('M1',[]);
    angular.module('M2',[]);
    ......
    angular.module('Mn',[]);
    
    angular.module('app',['M1','M2',...,'Mn']);
    
    

    M1,M2,...,Mn可能是不同的商業模組,可以單獨作為一個angular.module,最後全部掛載在app模組下。

    -----------------------------------分割線------------ ---------------------------------------

    以上是自動加載。如果採用手動加載,則不受名稱限制,不受app數量限制。

    <!DOCTYPE html>
    <html>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
    <body>
    
        <p id="app1">
            <p ng-controller="myCtrl">
                {{ hello }}
            </p>
        </p>
        
        <p id="app2">
            <p ng-controller="myCtrl">
                {{ hello }}
            </p>
        </p>
    
        <script type="text/javascript">
            var app1 = angular.module("test1",[]);
            app1.controller("myCtrl",function($scope){
                $scope.hello = "a Angular app";
            });
            
    
            var app2 = angular.module("test2",[]);
            app2.controller("myCtrl",function($scope){
                $scope.hello = " another Angular app";
            });
    
            angular.bootstrap(document.getElementById("app1"),['test1']);
            angular.bootstrap(document.getElementById("app2"),['test2']);
        </script>
    </body>
    </html>
    

    效果圖

    以上例子,啟動了兩個angular app,且沒有使用ng-app指令。

    回覆
    0
  • 迷茫

    迷茫2017-05-15 17:09:57

    謝謝各位的耐心解答

    回覆
    0
  • 为情所困

    为情所困2017-05-15 17:09:57

    一定要一樣的 因為這是最首要的angular綁定

    回覆
    0
  • 取消回覆