您的位置：首页 > Web前端 > AngularJS

AngularJS 学习之初体验

2016-05-17 18:55 260 查看

1.AngularJS 通过原生态的Model-View-Controller(MVC 模型-视图-控制器)的功能增强了HTML，使得WEB应用相对简单，也降低了构建复杂应用的难度，其提供了开发者在Web应用中的使用频繁的高级功能，如：

(1) 解耦应用逻辑、数据模型和视图；

(2) Ajax 服务；

(3) 依赖注入；

(4) 浏览历史（使书签和前进、后退按钮能够像在普通Web应用中一样工作）；

(5) 测试功能等。

2.数据绑定：正如所有语言都是从Hello World开始一样，AngularJS也不例外，如下使用Hello World来展示AngularJS的最基本功能

(1) <!DOCTYPE html>

<html ng-app>

<head>

<title>Simple APP</title>

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular.js"></script>

</head>

<body>

<inout ng-model="name" type="text" placeholder="Input your name">

<h2>{{name}}</h2>

</body>

</html>

(2) 在传统的web框架中，控制器将多个模型的数据和模板组合在一起然后去形成视图展示给用户，即单向视图；但是AngularJS是创建实时模板来代替视图，而不是将数据合并进模板后在更新DOM 即视图中的数据值是动态变化的；

(3) ng-app 属性声明所有被其包含的内容都属于AngularJS应用，只有被ng-app 属性包含的DOM元素才会受到AngularJS的影响；

(4) AngularJS 使用$ 表示预定义对象，即代表AngularJS 对象；

(5) $scope：数据模型对象(model Object),是一个简单的javascript对象，其中的属性可以被视图访问，也可以同控制器进行交互；

(6) AngularJS中有控制器的概念，类似于ng-app，使用ng-controller可以声明当前的DOM元素属于某个控制器，然后可以使用控制器的属性以及方法；

(7) AngularJS数据绑定的最近实践：在视图中通过对象的属性而非对象的本身来进行引用绑定；

3.模块：

(1) 在javascript中若将函数代码都定义在全局命名空间中，会导致属性冲突等严重问题，影响代码效率，故AngularJS中使用模块来封装，每个应用可以包含多个模块，每个模块实现具体的功能；

(2).使用模块的好处比如：

1) 保持全局命名空间的清洁；

2) 编写测试代码容易，并能保持其清洁，以便更容易找到互相隔离的功能；

3) 易于在不同的应用间服用代码；

4) 使应用能够以任意顺序加载代码的各个部分；

(3) AngularJS使用angular.module("模块名称"，“依赖列表”)来声明模块，此方法相当于是setter()方法；

(4)AngularJS使用angular.module("模块名称")来依赖模块，此方法相当于是getter()方法；在模块内部即可进行属性以及方法的定义

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： angularjs

相关文章推荐

新的分享

章节导航

AngularJS 学习 之 初体验

AngularJS 学习之初体验