angular22-ng-app指令

前端歌谣

于 2022-07-10 11:55:19 发布

阅读量269

点赞数

本文链接：https://blog.csdn.net/qq_41632427/article/details/125704116

版权

ng-app Angular模块控制器模块化开发 ng-click

关键词由CSDN通过智能技术生成

歌谣-前端-angular 专栏收录该内容

41 篇文章 0 订阅

订阅专栏

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

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