Angular Web APP 结构图:
module --> 模块 :相当于一个容器,Angular里的所有东西都得放在模块里,才能够被引用和加载。
directive --> 指令 :负责与HTML元素进行绑定,同时相互作用。
内置指令:ng-model、ng-bind、ng-click、ng-class、ng-if、ng-hide、ng-show、ng-repeat
自定义指令常用属性:restrict(EAMC)、replace、scope、template、templateUrl、link、transclude
$scope --> 作用域
数据绑定(data-binding),在angular应用中,自动同步视图组件与数据的行为(js中为$scope html中对应的表达式为{{}}或ng-bind="")。
service --> 服务 :公有的代码逻辑。
特点:单例、懒加载、共用函数
常用服务:$http $q $timeout $interval $rootScope
$http.get('url').success(function(){}).error(function(){});
$http['post'/'delete'/'put']('url',{
//数据对象
},{
//配置对象
});
$http({
url:' ',
method:' ',
params:{},
data:{},
...
})
自定义服务:cache
controller --> 控制器 :私有的代码逻辑,只针对专门的业务和视图进行绑定。
控制器:视图对应的业务逻辑,为数据模型添加行为和属性。
常用属性:$id $parent $root
常用函数:$watch $on $broadcast $emit $digest
filter --> 过滤器 :对数据进行过滤。
用来格式化或者过滤数据
内置过滤器:currency number date lowercase uppercase limitTo orderBy
ui-router --> 路由
ui.router:
路由参数:
'/home':只匹配'/home'
'user/:id'、'user/{id}':匹配'user/1234'或者'user/'
'messages?before&after':非rest传参
路由跳转重要指令和服务:ui-sref、$state
使用方法:声明ui-view指令模块,ui-router模块会把对应的页面内容,插入到ui-view组件中。