AngularJS使用

AngularJS

HBuilder

下载安装。官方网站：https://docs.angularjs.org/api下载地址: https://angularjs.org/

Angularjs目录结构最新版本是angular2.0,它与angular1.x区别比较大，我使用的版本是1.3版本。在使用基本功能时，只需要导入angular.js或angular.min.js文件就可以。其它的js文件是angularjs拆分出来的功能，例如angular-route.js,它是关于路由的脚本文件，在1.2版本时，使用路由不需要单独专稿angular-route.js,而在1.3版本后，使用路径需要单独导入angular-route.js

AngularJS基本使用介绍创建web项目(使用Hbuilder),并导入js文件。angularJs它主要的核心特性：MVC模块化 数据绑定  语义化标签(指令)  依赖注入等

MVCMvc核心理念是:将管理数据的代码(model),应用逻辑代码(controller),展示数据的代码(view)分离开。在angular应用中，视图就是DOM,控制器就是JavaScript,而模型数据被存储在对象的属性中。示例: Html代码        JS代码

双向数据绑定在传统的js框架中，它是将html代码与数据混合在一起，在发送给用户在显示出来，而angular它可以将UI中某个部分映射到javascript属性上，然后让它们自己去同步，这就叫做数据绑定，查看以下代码：

模块化在上述代码中，我在js文件中声明了一个全局的函数demo1Controller，在js的开发中是不建议定义全局的函数或变量的，它污染了全局空间，这种编码是不”优雅”的。在angular中我可以使用module(模块化来解决这个问题)代码进行修改如下：Html代码                               JS代码

依赖注入在上述代码中，大家一定有一个疑问，就是我在js代码中使用的$scope它是由谁创建的，为什么我可以使用它？其实就全是依靠angular提供的依赖注入来完成的，依赖注入的概念我在学习spring中已经接触过，不过在前端开发中，这是我第一次使用依赖注入。Angularjs中的注入一般分为三种：    推断式注入    显示注入（标注式注入）    行内注入（内联注入）

推断式注入如果没有明确的声明，AngularJS会假定参数名称就是依赖的名称。因此，它会在内部调用函数对象的toString()方法，分析并提取出函数参数列表，然后通过$injector将这些参数注入进对象实例。

显示注入（标注式注入）

行内注入（内联注入）