test.html:

<!DOCTYPE html>

<html lang="en" ng-app>

<head>

    <meta charset="UTF-8">

    <title>Document</title>

</head>

<body>

    <div ng-controller="HelloAngular">

        <p>{{greeting.text}},Angular</p>

    </div>

</body>

<script src="http://cdn.bootcss.com/angular.js/1.0.3/angular.min.js"></script>

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

</html>

ng-app 表示：告诉 Angular 引擎从这里开始是它应该管理的内容

ng-controller：设置控制器 Controller

其中：

    <div ng-controller="HelloAngular">

        <p>{{greeting.text}},Angular</p>

    </div>

是视图

HelloAngular.js:

function HelloAngular($scope){

    $scope.greeting = {text:'Hello'};

}

其中：

HelloAngular

是控制器，

$scope.greeting = {text:'Hello'};

是 数据模型。

$scope 充当 MVC 中的Data-Model 的角色，它是一个 POJO( Plain Old Javascript Object )，它提供了一些工具方法 $watch()/$apply()，它是表达式的执行环境（或者说是 作用域），它是一个树型结构，与 DOM 标签平行，子 $scope 对象会继承 $scope 上的属性，每一个 Angular 应用只有一个根 $scope 对象（一般位于 ng-app 上），$scope 可以传播事件，类似 DOM 事件，可以向上也可以向下。

Angular 会自动使用 $injector 自动注入 $scope 对象

输出：

Hello,Angular

AngularJS 初识笔记的更多相关文章

  1. Mastering Web Application Development with AngularJS 读书笔记-前记

    学习AngularJS的笔记,这个是英文版的,有些地方翻译的很随意,做的笔记不是很详细,用来自勉.觉得写下来要比看能理解的更深入点.有理解不对的地方还请前辈们纠正! 一.关于<Mastering ...

  2. AngularJs学习笔记--Forms

    原版地址:http://code.angularjs.org/1.0.2/docs/guide/forms 控件(input.select.textarea)是用户输入数据的一种方式.Form(表单) ...

  3. AngularJs学习笔记--expression

    原版地址:http://code.angularjs.org/1.0.2/docs/guide/expression 表达式(Expressions)是类Javascript的代码片段,通常放置在绑定 ...

  4. AngularJs学习笔记--directive

    原版地址:http://code.angularjs.org/1.0.2/docs/guide/directive Directive是教HTML玩一些新把戏的途径.在DOM编译期间,directiv ...

  5. AngularJs学习笔记--Guide教程系列文章索引

    在很久很久以前,一位前辈向我推荐AngularJs.但当时我没有好好学习,仅仅是讲文档浏览了一次.后来觉醒了……于是下定决心好好理解这系列的文档,并意译出来(英文水平不足……不能说是翻译,有些实在是看 ...

  6. AngularJs学习笔记--bootstrap

    AngularJs学习笔记系列第一篇,希望我可以坚持写下去.本文内容主要来自 http://docs.angularjs.org/guide/ 文档的内容,但也加入些许自己的理解与尝试结果. 一.总括 ...

  7. AngularJs学习笔记--html compiler

    原文再续,书接上回...依旧参考http://code.angularjs.org/1.0.2/docs/guide/compiler 一.总括 Angular的HTML compiler允许开发者自 ...

  8. AngularJs学习笔记--concepts(概念)

    原版地址:http://code.angularjs.org/1.0.2/docs/guide/concepts 继续.. 一.总括 本文主要是angular组件(components)的概览,并说明 ...

  9. AngularJS学习笔记2——AngularJS的初始化

    本文主要介绍AngularJS的自动初始化以及在必要的适合如何手动初始化. Angular <script> Tag 下面通过一小段代码来介绍推荐的自动初始化过程: <!doctyp ...

随机推荐

  1. [杂] ASP.NET MVC 之 Route To MvcHandler

    首先,本文参考了不少东东,仅供Q_L_H自己使用,ZZ自己负责.先上一张全家福: HttpModules and HttpHandlers ASP.NET MVC 是 HttpHandler. Url ...

  2. PHP 常用正则汇总

     平时做网站经常要用正则表达式,下面是一些讲解和例子,仅供大家参考和修改使用:    }|d{})-((([-]{}))|([|]))-(([-]([-]{}))|([|]))$/   ([-]{}) ...

  3. Windows下64位Apache服务器的安装

    转自:http://www.blogjava.net/greatyuqing/archive/2013/02/13/395308.html 首先需要说明的是,Apaceh服务器没有官方的64位版本,只 ...

  4. Hark的数据结构与算法练习之基数排序

    算法说明 基数排序是基于计数排序的,所以看这个之前要先看一下计数排序对于理解基数排序是很有帮助的(发现计数和基数的音节几乎一致啊).这个我有写,请点击. OK,现在你肯定已经熟悉了计数排序,那么我就来 ...

  5. Android 编程下判断当前设备是手机还是平板

    /** * 判断当前设备是手机还是平板,代码来自 Google I/O App for Android * @param context * @return 平板返回 True,手机返回 False ...

  6. SPEL语言-Spring Expression Language

    Spring表达式语言全称为"Spring Expression Language",缩写为"SpEL",类似于Struts 2x中使用的OGNL表达式语言,能 ...

  7. ThreadLocal使用和原理

    实现机制 1.每个Thread对象内部都维护了一个ThreadLocalMap这样一个ThreadLocal的Map,可以存放若干个ThreadLocal. /* ThreadLocal values ...

  8. KVM切换器

    所谓KVM,就是Keyboard.Video.Mouse的缩写,正式的名称为多计算机切换器.简单的说,就是一组键盘.显示器和鼠标,控制2台.4 台.8台.16台甚至到4096台以上的计算机主机. KV ...

  9. Self Numbers[HDU1128]

    Self Numbers Time Limit: 20000/10000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)To ...

  10. c# windows service

    using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; usin ...