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. Android之圆角矩形

    安卓圆角矩形的定义 在drawable文件夹下,定义corner.xml <?xml version="1.0" encoding="utf-8"?> ...

  2. 【Ubuntu日常技巧】VirtualBox多网卡路由配置，保障虚拟机连接上外网

    [背景]: 配置Ubuntu 虚拟机双网卡,一个是Host-Only网络,一个是桥接网络.当在虚拟机中同时连接到两个网络后,虚拟机能够ping通内部网络,不能ping通外部网络,如www.baidu. ...

  3. JQZoom 图片放大插件的使用

    QZoom是一个基于最流行的jQuery的图片放大器插件.它功能强大,使用简便.支持标准模式.反转模式.无镜头.无标题的放大,并可以自定义jQZoom的窗口位置和渐隐效果,修正IE6的select b ...

  4. 如何扫描出Android系统媒体库中视频文件

    Android系统启动时会去扫描系统文件,并将系统支持的视频文件(mp4,3gp,wmv)扫描到媒体库(MediaStore)中,下面代码演示如何获得这些文件的信息: publicstatic Lis ...

  5. loadrunner常见问题总结

    在玩Loadrunner时经常性的出现脚本录制为空的情况,下面是我总结出的解决办法: 1.在用loadrunner录制脚本时发现脚本录制为空,查找原因,我首先看. IE选项->连接->局域 ...

  6. DOS常用的简单命令

    在windows下的cmd里使用 dir 列出当前目录下的文件及文件夹 md 创建目录 rd 删除目录(只能删除空目录) cd 进入指定目录 cd .. 返回上一级目录 cd / 返回到根目录 del ...

  7. Xamarin如何生成Android项目的APK

    Xamarin如何生成Android项目的APK 首先需要选择Release模式生成项目.然后从“生成”菜单中选择Export Android Package命令,就可以导出APK包.APK保存在An ...

  8. 判断 Gym 100502K Train Passengers

    题目传送门 /* 题意:几个判断,车上的人不能 <0 或 > C:车上初始和结束都不能有人在 (为0):车上满员时才有等候的人 水题:难点在于读懂题目意思,状态不佳,一直没搞懂意思,在这题 ...

  9. 线段树 Codeforces Round #197 (Div. 2) D. Xenia and Bit Operations

    题目传送门 /* 线段树的单点更新:有一个交叉更新,若rank=1,or:rank=0,xor 详细解释:http://www.xuebuyuan.com/1154895.html */ #inclu ...

  10. java多次替换(replace不行)

    import java.util.regex.Matcher; import java.util.regex.Pattern; public class test { public static vo ...