关键词：
1-组件
创建组件，使用angularjs模块的conponent()方法，component(name,options);使用编译器注册组件定义，表示应用程序中的一个独立的UI组件。组件定义通常仅由模板和控制器组成。name为组件名，options为组件定义对象，其属性包括：controller（应该与新创建的作用域相关联的控制器构造函数或作为字符串传递的注册控制器的名称）、controllerAs（用于在组件范围内引用控制器的标识符名称）、template（html模板作为一个字符串或函数返回一个HTML模板作为一个字符串，应该被用作这个组件的内容，默认为空字符串）、templateUrl（路径或函数，返回一个应该用作该组件内容的HTML模板的路径）、bindings（定义DOM属性与组件属性之间的绑定，组件属性始终绑定到组件控制器）、transclude（是否启用内容泄露）、require（要求其他指令的控制器并将其绑定到该组件的控制器）、$...（附加到指令工厂函数和控制器构造函数的附加属性，组件路由器用于注释）
定义组件的例子：
var myMod = angular.module(‘phonecatApp1‘, []);
//1
myMod.component(‘myComp‘,{
template:‘<div>My name is {{$ctrl.name}}</div>‘,
controller:function(){
this.name = ‘shahar‘;
}
});
//2
myMod.component(‘myComp‘,{
template:‘<div>My name is {{$ctrl.name}}</div>‘,
bindings:{name:‘@‘}
});
//3
myMod.component(‘myComp‘,{
templateUrl:‘views/my-comp.html‘,
controller:‘MyCtrl‘,
controllerAs:‘ctrl‘,
binds:{name:‘@‘}
})
ps：定义组件时其名可以为myComp类似命名的组件，但在HTML 中引入时则需要使用类似<my-comp></my-comp>形式的命名法。
使用组件形式实现ul电话列表：
Component.html文件：
<!DOCTYPE html>
<html lang="en" ng-app="phonecatApp">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="../angular/angular.js"></script>
<script src="../scripts/app1.js"></script>
<script src="../scripts/component1.js"></script>
</head>
<body>
<phone-list></phone-list>
</body>
</html>
app1.js：
angular.module(‘phonecatApp‘,[]);
component.js：
angular.module(‘phonecatApp‘).component(‘phoneList‘,{
template:
‘<ul>‘ +
‘<li ng-repeat = "phone in $ctrl.phones">‘ +
‘<span>{{phone.name}}</span>‘ +
‘<p>{{phone.snippet}}</p>‘ +
‘</li>‘ +
‘</ul>‘,
controller:function PhoneListController(){
this.phones = [
{
name:‘Nexus S‘,
snippet:‘The Next,Next Generation tablet.‘
},
{
name:‘Motorola XOOM with wifi‘,
snippet:‘The Next,Next Generation tablet.‘
},
{
name:‘MOTOROLA XOOM‘,
snippet:‘The Next,Next Generation.‘
}
];
}
});
2--$http
$http({
url:‘data.json‘, //可以利用json文件模拟
method:‘GET‘,
Params:{
‘username’:’tan’
}
}).success(function(data,header,config,status){ //响应成功
}).error(function(data,header,config,status){ //处理响应失败
});
// 修改全部消息状态为已读
function initialize() {
var deferred = $q.defer();//生成deferred异步对象
$http({
url: ‘/api/Message/initialize‘,
method: ‘POST‘
}).success(function (result) {
deferred.resolve(result);
//执行到这里，改变deferred状态为执行成功，返回result为从后台取到的数据，可以继续执行then、done
}).error(function (result) {
deferred.reject(result);
//执行到这里，改变deferred状态为执行失败，返回data为报错，可以继续执行fail
});
return deferred.promise;
//起到保护作用，不允许函数外部改变函数体内的deferred状态，控制异步执行完成
}
Ps:url为绝对或相对的请求目标。params（字符串map或对象），会被转换成查询字符串追加到URL后面，如果不是字符串，将会被json序列化。data这个数据代表转换过后的响应体。status表示响应的HTTP状态码，headers这个函数是头信息的getter函数，可以接受一个参数，用于获取对应名字值。config这个对象用来生成原始请求的完整设置对象。statusText是响应的HTTP状态文本。
ps：
$q用于ajax异步请求数据的回调控制deferred。angularjs中自己封装的一种promise实现。一种内置服务，可以异步执行函数，且当函数完成时或异常时允许使用函数的返回值或返回执行状态通知。
$q常用方法：defer()创建一个deferred对象，该对象可以执行几个常用方法，如resolve、reject、notify等,all()传入promise的数组，批量执行，返回一个promise对象，when()传入一个不确定参数，若符合promise标准就返回一个promise对象。promise中定义的三种状态：完成状态、等待状态、拒绝状态。状态的变更是不可逆的，等待状态可以变成完成或拒绝状态。
promise/deferred：承诺/延迟
promise帮助开发者用同步的方式编写异步的代码。一种对执行结果不确定的一种预先定义，如果成功做什么事，失败做什么事，像是事先给了承诺。
defer，延迟，$defer()可以创建一个defer延迟对象实例，表示将会完成的任务的对象。$q中，使用resolve方法变成完成状态，使用reject方法，变成拒绝状态。
3--module
module是angularjs代码的入口，首先需要声明module，然后才定义angularjs中的其他组件元素，如controller、service、filter、directive、config代码块、run代码块等。
angular.module()可传入三个参数：模块的名称（必选参数，在其他地方可以被其他模块注入或在ngApp指令中声明应用程序主模块）、模块的依赖（本模块需要依赖的其他模块的参数，若此处无声明，则无法在模块中使用依赖模块的任何组件）、模块的启动配置函数（在angularjs config阶段会调用该函数，对模块中的组件进行实例化对象实例之前的特定配置，如$routeProvider配置一样程序的路由信息）。
参考学习并感谢：
https://docs.angularjs.org/tutorial/step_00
http://www.runoob.com/angularjs/angularjs-tutorial.html
angularjs2学习笔记5asyncdatabinding
网址https://angular.io/api/common/AsyncPipe模块importAsyncPipefrom‘@angular/common’;使用方法observable_or_promise_expression|async异步管理订阅Observable或Promise，返回其最后的值。当有新值时，异步管道给组件置一个变化确认的标记。当组... 查看详情
angularjs学习笔记
?Angular????简介?js是基础，angularJs是js框架 ?起源 2009年GoogleFeedbackProject将6个月开发的17000行前端代码，使用3周压缩到1500行 ?简介 Angularjs致力于减轻开发人员在开发AJAX应用过程中的痛苦 官网:http://www.angularjs.org/?ajax开发是单页... 查看详情
《angularjs高级程序设计》学习笔记
一、AngularJS应用剖析 AngularJS存在一些最主要的构件，如模型，视图和控制器。但AngularJS中也有许多其他可供灵活使用的部件，包括模块，指令，过滤器，工厂和服务。 一.1依赖注入 没有依赖注入(dependenciesinjector)... 查看详情
angularjs学习笔记依赖注入
...对象 3.通过参数进行传递（在这里是通过函数参数）AngularJs通过$injector注入器服务来管理依赖关系的查询和实例化，通过其get方法来获取依赖服务的实例，简单点说，它就是生产依赖对象的工厂，负责实例化AngularJs中所有的... 查看详情
angularjs学习笔记
学习视频地址：http://i.youku.com/i/UMzI1MjQ0MDgw?spm=a2h0z.8244218.2371631.d6373（大漠穷秋）配置环境（cnpm方式，angular-cli）1.安装nodejs2.安装angularjs环境打开命令窗，cd到项目目录运行npmi-gcnpm安装cnpm运行cnpmi-gangular-cli安装angular cnpmin 查看详情
我的angularjs学习轨迹
...年初,那个时候的版本1.0.*，那个时候国内主要的中文资料AngularJS学习笔记：http://zouyesheng.com/angular.html，angularjs中文社区翻译的一些官方文档质量较差，学习笔记的质量相对比较高，不过我找到学习笔记的时候就比较晚了。先后... 查看详情
angularjs学习笔记——自定义指令
对指令的第一印象：它是一个自定义标签！先来看一个简单的指令：<!doctypehtml><htmlng-app="myApp"><head><title>自定义指令</title><scripttype="text/javascript"src="http://localhost:10100/angular.min.js"chars 查看详情
angularjs学习笔记(代码片段)
AngularJS在加载启动时，会做3件事情：1.依赖注入2.创建rootscope作为整个模型的上下文3.从ngApp开始编译DOM，处理后续的指令和绑定当它启动后，它会等待浏览器的输入事件（鼠标、HTTP请求等），若输入事... 查看详情
angularjs1.x学习笔记8-自定义指令（上）
AngulaJS的指令是一种非常强大的特性，一个ng-repeat就能让我们非常方便的展示一个数据列表，指令相当于是一个组件，为我们将一些东西封装起来了，提供了复用的可能性。个人认为自定义指令还是比较复杂的，下面开始攻... 查看详情
《http权威指南》学习笔记
一概念a浏览器解析出URL。b域名解析得出域名。c有端口的解析端口。d进行TCP连接。e发送请求报文。d接收响应报文。e断开TCP连接。1HTTP【概念-应用层】2Web客户端与服务器【结构组件】3资源【资源类型】4事务【概念理解】5报文... 查看详情
angularjs学习笔记
什么是AngularJS？AngularJS使得开发现代的单一页面应用程序（SPAs：SinglePageApplications）变得更加容易。AngularJS把应用程序数据绑定到HTML元素。AngularJS可以克隆和重复HTML元素。AngularJS可以隐藏和显示HTML元素。AngularJS可以在HTML元素"... 查看详情
angularjs学习笔记
AngularJS表达式与JavaScript表达式类似于JavaScript表达式，AngularJS表达式可以包含字母，操作符，变量。与JavaScript表达式不同，AngularJS表达式可以写在HTML中。与JavaScript表达式不同，AngularJS表达式不支持条件判断，循环及异常。与Java... 查看详情
angularjs学习笔记
最近换了工作，新环境主推AngularJS4，学习其他之余，看了AngularJS的教程，有备无患。笔记主要基于Angular2，其中观点只是目前的感受，也许经过正式项目之后，会有更全面的看法。1.AngularJS的优点 1)规范了HTML元素的绑定方式... 查看详情
angularjs1.x学习笔记6-控制器和作用域
经过一番艰苦卓绝的鏖战，我终于来到了控制器和作用域部分。控制器作为MVC的C，其重要性不可谓不重要；作用域决定了你可以拿到哪些东西，亦是分外重要。现在就来学习一下两个东西。去看看$apply,$watch,$broadcast是个什... 查看详情
angularjs学习笔记--服务
在angularjs中，服务是一个函数或对象，可在angularjs应用中使用。其中$location服务可以返回当前页面的url地址。要使用它，需要在controller中进行定义，作为一个参数传入到controller中。<!DOCTYPEhtml><htmllang="en"><head><scri... 查看详情
angularjs学习笔记
1.AngularJS四大核心特性1)MVC =>model(数据) vew(视图) control(行为) 终极目的是模块化和复用2)模块化和依赖注入,一切从module模块开始,module下面才有controller,service,directive,config,filter等3)数据的双向绑定4)指令 2.an... 查看详情
[angularjs-学习笔记]工具篇
...始学习前端知识一直都是在慕课网，所以这次准备学习下angularjs等了好久，终于慕课网出了angularjs的内容，于是准备开始跟着老师的步骤进行学习。 大漠老师关于开发工具的内容讲得比较快，对于其中前端常用的工... 查看详情
angularjs学习笔记
最近项目要用angularjs，就花了两天时间大致的学习了一下angularjs，将做的脑图和demo分享出来。一、脑图（xmind）脑图地址：https://github.com/Craft24/brainmind/blob/master/AngularJS%E5%AD%A6%E4%B9%A0%E6%91%98%E8%A6%81.xmind二、demo地址 主要是一些... 查看详情