angular22-ng-app指令_html

 

<!DOCTYPE html>
     <html lang="en">
      
     <head>
         <meta charset="UTF-8">
         <meta name="viewport" content="width=device-width, initial-scale=1.0">
         <title>ng-app指令</title>
     </head>
     <!-- 需要angular的代码必须包裹在ng-app的代码中 -->
      
     <body ng-app="myApp">
      
         <div ng-controller="App1Controller">
             <input type="button" value="按钮1" ng-click="do1()">
         </div>
         <div ng-controller="App2Controller">
             <input type="button" value="按钮2" ng-click="do2()">
         </div>
         <script src="./js/Angular.js"></script>
         <script>
             //零件1
             /* 找到第一个ng-app就不会再找了 */
             var myApp1 = angular.module('myApp1', []);
             myApp1.controller('App1Controller', ['$scope', function($scope) {
                     $scope.do1 = function() {
                         console.log(111111);
                     }
                 }])
                 //零件2
             var myApp2 = angular.module('myApp2', []);
             myApp2.controller('App2Controller', ['$scope', function($scope) {
                 $scope.do2 = function() {
                     console.log(22222);
                 }
             }])
             angular.module('myApp', ['myApp1', 'myApp2'])
                 /*   angular.bootstrap(document.querySelector('[ng-app="myApp2"]'), ["myApp2"]) */
         </script>
     </body>
      
     </html>

运行结果

angular22-ng-app指令_html_02