• AngularJS学习篇(十五)


    AngularJS 模块

    模块定义了一个应用程序。

    模块是应用程序中不同部分的容器。

    模块是应用控制器的容器。

    控制器通常属于一个模块。

    创建模块

    你可以通过 AngularJS 的 angular.module 函数来创建模块:

    <div ng-app="myApp">...</div>
    
    <script>
    
    var app = angular.module("myApp", []); 
    
    </script>

    注意:模块的定义[]是定义模块之间依赖关系,中括号[]表示该模块没有依赖,如果有依赖的话会在中括号写上依赖的模块名字

    JavaScript 中应避免使用全局函数。因为他们很容易被其他脚本文件覆盖。

    AngularJS 模块让所有函数的作用域在该模块下,避免了该问题。

    <div ng-app="myApp" ng-controller="myCtrl">
    {{ firstName + " " + lastName }}
    </div>
    <script>
    var app = angular.module("myApp", []);
    app.controller("myCtrl", function($scope) {
        $scope.firstName = "John";
        $scope.lastName = "Doe";
    });
    </script>

    对于 HTML 应用程序,通常建议把所有的脚本都放置在 <body> 元素的最底部。

    这会提高网页加载速度,因为 HTML 加载不受制于脚本加载。

    在我们的多个 AngularJS 实例中,您将看到 AngularJS 库是在文档的 <head> 区域被加载。

    在我们的实例中,AngularJS 在 <head> 元素中被加载,因为对 angular.module 的调用只能在库加载完成后才能进行。

    另一个解决方案是在 <body> 元素中加载 AngularJS 库,但是必须放置在您的 AngularJS 脚本前面:

    <!DOCTYPE html>
    <html>
    <script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
    <body>
    
    <div ng-app="myApp" ng-controller="myCtrl">
    {{ firstName + " " + lastName }}
    </div>
    
    <script src="myApp.js"></script>
    <script src="myCtrl.js"></script>
    
    </body>
    </html>
    //myApp.js
    var
    app = angular.module("myApp", []);
    //myCtrl.js
    app.controller("myCtrl", function($scope) {
        $scope.firstName    = "John";
        $scope.lastName= "Doe";
    });
  • 相关阅读:
    php随笔3-thinkphp 学习-ThinkPHP3.1快速入门(1)基础
    自己动手写PHP MVC框架
    Aptana Studio 3 官方汉化包汉化
    PHP使用手册
    关系型数据库:关系模式设计原则
    Git使用教程
    高并发与负载均衡-nginx-session一致性
    高并发与负载均衡-nginx-安装-配置-location-负载均衡
    高并发与负载均衡-nginx-反向代理概念
    Java-笔记2
  • 原文地址:https://www.cnblogs.com/dehuachenyunfei/p/6738969.html
Copyright © 2020-2023  润新知