1.Angularjs指令属性ng-app和ng-controller的理解

ng-app指令-标记了AngularJS脚本的作用域，在<html>中添加ng-app属性即说明整个<html>都是AngularJS脚本作用域。开发者也可以在局部使用ng-app指  令，如<div ng-            app>，则AngularJS脚本仅在该<div>中运行。

ng-controller指令-定义了应用程序控制器。控制器可以初始化数据模型，它在建立模型（model）和视图（view）之间的数据绑定中起到至关重要的作用。AngularJS 使用$scope 对象   来调用控制器。 $scope（相当于作用域、控制范围） 是一个应用象(属于应用变量和函数)，用来保存AngularJS Model(模型)的对象。

 function PhoneListCtrl($scope) {

   $scope.phones = [

     {"name": "Nexus S",

      "snippet": "Fast just got faster with Nexus S."},

     {"name": "Motorola XOOM™ with Wi-Fi",

      "snippet": "The Next, Next Generation tablet."},

     {"name": "MOTOROLA XOOM™",

      "snippet": "The Next, Next Generation tablet."}

   ];

 }

链接地址：http://www.angularjs.cn/A003  http://www.angularjs.cn/A005

2.Angularjs的模块化和模块的加载和依赖

Angularjs模块-将一个应用程序碎片化，每个单独的模块式AngularJSy应用程序的一部分，它可以是一个Controller，也可以是一个Service服务，也可以是一个过滤器(Filter)，也可以是一个directive(指令)等等…都是属于一个模块。一个模块，其实是一个在应用程序的引导程序中运行的，一个配置的集合和运行块的集合。拆分的原因是，在你的测试中常常需要忽略掉初始化代码，因为这些代码比较难测试。通过把它拆分出来就能在测试中方便地忽视掉它。通过只加载和当前测试相关的模块，也能使测试更专一。

应用程序运行启动时，加载装配各个模块，然后这些模块的组合，构成了你的应用程序，其中模块之间因为有依赖关系所以会有优先级

链接地址（http://www.tuicool.com/articles/nAZ3yq  http://www.jb51.net/article/60505.htm）

配置块

其实在模块上有一些非常方便的方法，它们就相当于是一个 config 配置块，看例子：

 angular.module('myModule', []).

 value('a', 123).

 factory('a', function() { return 123; }).

 directive('directiveName', ...).

 filter('filterName', ...);

 // is same as

 angular.module('myModule', []).

 config(function($provide, $compileProvider, $filterProvider) {

   $provide.value('a', 123);

   $provide.factory('a', function() { return 123; });

   $compileProvider.directive('directiveName', ...);

   $filterProvider.register('filterName', ...);

 });

当AngularJS在进行引导启动你的应用程序的时候，它会首先定义所有的常量。然后再在配置块中使用同一个 常量列表 去注册它们。

一个模块就是一系列配置和代码块的集合，它们是在启动阶段就附加到应用上的。一个最简单的模块由两类代码块集合组成的：

配置代码块 - 在注入提供者注入和配置阶段执行。只有注入提供者和常量可以被注入到配置块中。这是为了防止服务在被配置好之前就被提前初始化。
运行代码块 - 在注入器被创建后执行，被用来启动应用的，它会在所有的服务配置完毕，注入器被创建完毕之后执行。只有实例和常量能被注入到运行块中。这是为了防止在运行后还出现对系统的配置。

模块可以把其他模块列为它的依赖。“依赖某个模块”意味着需要把这个被依赖的模块在本块模块之前被加载。换句话说被依赖模块的配置块会在本模块配置块前被执行。运行块也是一样。任何一个模块都只能被加载一次，即使它被多个模块依赖。所以模块加载具有优先级

依赖关系

一个模块，它知道所有它所依赖的其它模块，也就是说在它加载起来前，需要将它所依赖的其它所有模块给加载起来。换句换说，对于需要配置块的模块来说，配置块一定是在需要它的模块初始化之前就被初始化完毕了。 同样的，运行块(run block)也是这样的，一个模块，会且仅会被加载一次，无论有多少个模块引用了它，它都只会被加载一次的。

小插曲：模板 视图组件被AngularJS用下面这个模板构建出来：

 <html ng-app>

 <head>

   ...

   <script src="lib/angular/angular.js"></script>

   <script src="js/controllers.js"></script>

 </head>

 <body ng-controller="PhoneListCtrl">

   <ul>

     <li ng-repeat="phone in phones">

       {{phone.name}}

     <p>{{phone.snippet}}</p>

     </li>

   </ul>

 </body>

 </html>
 <html ng-app>

 <head>

   ...

   <script src="lib/angular/angular.js"></script>

   <script src="js/controllers.js"></script>

 </head>

 <body ng-controller="PhoneListCtrl">

   <ul>

     <li ng-repeat="phone in phones">

       {{phone.name}}

     <p>{{phone.snippet}}</p>

     </li>

   </ul>

 </body>

 </html>

Angularjs之基本概念梳理（一）的更多相关文章

  1. [DOM Event Learning] Section 2 概念梳理 什么是事件 DOM Event

    [DOM Event Learning] Section 2 概念梳理 什么是事件 DOM Event   事件 事件(Event)是用来通知代码,一些有趣的事情发生了. 每一个Event都会被一个E ...

  2. Angularjs,WebAPI 搭建一个简易权限管理系统 —— Angularjs名词与概念（一）

    目录 前言 Angularjs名词与概念 Angularjs 基本功能演示 系统业务与实现 WebAPI项目主体结构 Angularjs 前端主体结构 2. 前言 Angularjs开发CRUD类型的 ...

  3. 前端 初识angularJS的基本概念

    DEMO1演示地址:http://webenh.chinacloudsites.cn/default/demo1   今天在这里分享分享我个人学习angular的知识点总结.在还没有接触到angula ...

  4. 初识angularJS的基本概念

    今天在这里分享分享我个人学习angular的知识点总结.在还没有接触到angular的时候,还真的不知道它到底有什么作用,直到我开始学习它,并且运用到它的时候,才知道angular这么强大.作为一个前 ...

  5. Spring 笔记（一）概念梳理

    概念 预备知识 1. POJO POJO是Plain Old Java Object的缩写,是软件开发大师Martin Fowler提出的一个概念,指的是一个普通Java类.也就说,你随便编写一个Ja ...

  6. JavaWeb三大器（过滤器、拦截器、监听器）概念梳理

    最近工作碰到了一个问题:项目A需要收集项目B中的用户活跃数信息,最后通过HttpSessionAttributeListener实现.在开发过程中,网上查找了过滤器.拦截器.监听器的帖子,这里对自己收 ...

  7. Web Service概念梳理

    计算机技术难理解的很多,Web Service 对我来说就是一个很难理解的概念:为了弄清它到底是什么,我花费了两周的时间,总算有了一些收获,参考了不少网上的资料,但有些概念说法不一.我以w3c和 一些 ...

  8. 多通道(Multichannel)单通道(singlechannel)图像概念梳理

    在做机器视觉时,常常要将一个多通道图像分离成几个单通道图像或者将几个单通道图像合成一个多通道图像,以方便图像处理,但是.写这篇博客,是为加深对这两个概念的理解,下面会给出部分OpenCV对单通道与多通 ...

  9. [转]Android中dp,px,sp概念梳理以及如何做到屏幕适配

    http://blog.csdn.net/jiangwei0910410003/article/details/40509571 今天又开始我的App开发,因为之前一直做的是SDK,所以涉及到界面UI ...

随机推荐

  1. [iOS]如何把App打包成ipa文件，然后App上架流程[利用Application Loader]

    摘自:http://www.cnblogs.com/wangqi1221/p/5240281.html 在上一篇博客已经讲过上传项目了,但是有的时候,需要我们进行打包成ipa包到别的手机上跑(但是前提 ...

  2. cannot open /proc/bus/usb/devices, No such file or directory

    由于kernel config中没有打开对应的配置. make menuconfig 选择: Device Drivers ---> [*] USB support ---> [*] US ...

  3. iOS：FFmpeg视频播放和直播框架

    视频直播和播放转码器框架 介绍: FFmpeg是一套可以用来记录.转换数字音频.视频,并能将其转化为流的开源计算机程序.采用LGPL或GPL许可证. 它提供了录制.转换以及流化音视频的完整解决方案.它 ...

  4. C语言：通过指针对数组元素进行排序

    // //  main.c //  Pointer_array // //  Created by ma c on 15/8/2. //  Copyright (c) 2015年 bjsxt. All ...

  5. 美国大学排名之本科中最用功的学校top15

    美国大学排名之本科中最用功的学校top15 威久留学2016-07-29 13:15:59美国留学 留学新闻 留学选校阅读(490)评论(1)   去美国留学的同学可能都知道USnews美国大学排名, ...

  6. nginx源码学习----内存池

    最近在进行监控平台的设计,之前一直觉得C/C++中最棘手的部分是内存的管理上,远不止new/delete.malloc/free这么简单.随着代码量的递增,程序结构复杂度的提高.各种内存方面的问题悄然 ...

  7. H3C S3600-28TP-SI配置命令

    模式分类为:<H3C> 用户视图       [H3C] 系统视图    [H3C-Ethernet1/0/1] 以太网端口视图 [H3C-vlan10] VLAN视图   [H3C-Vl ...

  8. ios之无限 自动 图片轮播器的实现

    比较之前发布的手动无限图片轮播器进行了改进.实现了自动无限轮播的功能.比较适合团购标题分类下面的轮播器功能. 实现思路: * 开启一个定时器,把操作放入消息循环池.每隔一定时间,操作执行一次. * 注 ...

  9. electron Uncaught ReferenceError: jQuery is not defined

    用electron写桌面程序时 ui部分的html页面引入的js会用到jquery 用常规的方式引入是不行的,会抛出如题的异常 <script type="text/javascrip ...

  10. C#并发处理-锁OR线程安全？

    每次写博客,第一句话都是这样的:程序员很苦逼,除了会写程序,还得会写博客! 当然,题外话说多了,咱进入正题! 背景 基于任务的程序设计.命令式数据并行和任务并行都要求能够支持并发更新的数组.列表和集合 ...