育知同创HTML5开发学习干货分享 AngularJS总结

常用指令

1. ng-app

   

   整个AngularJS项目的开始指令

   在使用RequireJS+AngularJS中，不需要显示的添加添加ng-app指令，而是通过代码动态添加

2. ng-controller

负责与JavaScript中的控制器进行关联

3. ng-model

给表单元素进行使用，负责数据的双向绑定，代替了表单元素中的value属性

ng-model是一种语法糖，不使用此指令，也可以实现同样的效果

4. ng-style

给元素添加CSS样式

5. ng-class

给元素添加class值

6. ng-click

给元素绑定单击事件

7. ng-mouseover

8. ng-focus

9. ng-blur

10. ng-change

11. ng-repeat遍历数组或对象注意：如果数组中存在重复元素，则使用track by $index

12. ng-hrefa

标签的href属性替换成ng-href属性进行使用

13. ng-bind

表达式的指令形式，不会出现页面上渲染出大括号的问题

14. ng-cloak

解决页面渲染出大括号的问题

15. ng-init

初始化数据使用

16. ng-show

17. ng-hide

18. ng-if

19. ng-include

控制器

父子控制器作用域问题

• 父控制器中的数据，子控制器可以直接使用

• 如果子控制器和父控制器中变量冲突，优先使用自己的，使用$parent来访问父控制器中的数据

• rootScope上面的数据，任何控制器都可以直接使用

传值方式（父传子、子传父）

内置服务

1. $scope

   添加属性和方法，渲染到页面上

2. $filter在控制器中使用过滤器

3. $rootScope

根部的scope，添加到此处的值，任何控制器都可以访问

4. $http

网络请求服务

5. $interval

angularJS提供的定时器

6. $timeoutangularJS

提供的定时器

7. $location

获取有关地址的信息

过滤器

1. currency

价钱的显示

2. number

数字千位分隔符

3. orderBy

按照某种方式排序

4. date

时间格式化输出

5. limitTo

6. filter

根据关键字，在数据中进行筛选

7. uppercase lowercase

大小写转换

8. json

格式化json显示

9. 自定义过滤器

使用filter()方法，进行过滤器的自定义

高阶函数，函数内部返回一个函数，内部函数返回结果

自定义过滤器的使用

自定义指令

使用directive()方法，进行自定义指令

自定义指令的使用

服务相关

service

直接向this上面添加属性和方法即可

factory

返回对象

value

变量的共享

constant

常量的共享

可以注入到config中

provider

provider是service factory value的内部实现

provider提供的服务可以注入到config中

AngularJS模块

Angular-ui-router

1. 模块使用时，首先在初始化app的时候添加模块名称

2. 编写HTML结构代码

3. 编写路由规则

4. 路由跳转以及参数的传递

5. 参数的接收

6. 内置服务

• $stateProvider状态提供者，负责各种路由规则的设定

• $urlRouterProvider设置默认路由

• $state路由跳转使用

• $stateParams用于接收路由传递的参数

AngularCSS

1. 引入模块

2. 在控制器中使用$css使用

内置服务

• $css

AngularAMD

1. angular-ui-router配置路由规则的时候，state中需要修改

2. 对应的控制器文件home.js，返回的只是数组而已

RequireJS

1. 引入文件，并设置主模块

2. 配置操作

3. 模块的引入操作

4. 定义模块

Gulp

1. 电脑上全局安装

2. 初始化package.json文件（进入项目根目录）

3. 在项目中安装gulp

4. 在项目中安装gulp插件

5. 创建gulpefile.js文件，并添加代码

6. 执行命令，进行打包压缩

JSSDK的开发

1. 配置安全域名

2. 代码中的配置

3. ready方法的使用

4. 其他方法的使用

拍照或从手机相册选取照片

打开地图，定位到指定的位置