首页 | 新闻 | 新品 | 文库 | 方案 | 视频 | 下载 | 商城 | 开发板 | 数据中心 | 座谈新版 | 培训 | 工具 | 博客 | 论坛 | 百科 | GEC | 活动 | 主题月 | 电子展
返回列表 回复 发帖

Angular.js 介绍及实践教程(1)简介

Angular.js 介绍及实践教程(1)简介

简介AngularJS 是一款来自 Google 的前端 JavaScript 框架,也是    SPA(single-page-application,单页应用)框架。AngularJS 框架的体积非常小,但是设计理念和功能却非常强大,极大地简化前端开发的负担,它快速成为了 JavaScript 的主流框架,帮助开发者从事 web 开发。
SPA 和 MVCSPA:单页面应用是指用户通过浏览器加载独立的 HTML 页面并且无需离开此导航页面。对用户操作来说,一旦加载和执行单个页面应用程序通常会有更多的响应,这就需要返回到后端 Web 服务器,而单页面应用为用户提供了一个更接近本地移动或桌面应用程序的体验,这就是单页面应用的优势所在。
MVC:模型(model)-视图(view)-控制器(controller)的缩写,一种软件设计典范,用一种业务逻辑、数据、界面显示分离的方法组织代码,将业务逻辑聚集到一个部件里面,在改进和个性化定制界面及用户交互的同时,不需要重新编写业务逻辑。MVC 被独特的发展起来用于映射传统的输入、处理和输出功能在一个逻辑的图形化用户界面的结构中。
基本概念针对客户端应用开发的 AngularJS 吸收了传统的 MVC 基本原则,但并不只是传统意义上的 MVC,更接近于 MVVM(Model-View-ViewModel)。
Model:是应用中的数据,一般是简单的 JavaScript 对象。
ViewModel:是一个用来提供特别数据和方法从而维护指定 View 的对象。
View:是 AngularJS 解析后渲染和绑定后生成的 HTML,它能帮助您创建 web 应用的架构。
$scope(作用域):是 AngularJS 中的一个 JavaScript 对象,这个对象使用简单的 API 来侦测和广播状态变化。在这里就是要将域模型暴露给视图(模板),只需把属性设置给$scope 实例,就可以在模板渲染时得到这个值。
$scope 也可以针对特定的视图来扩展数据和特定的功能,只要在$scope 实例上定义一些函数就能将特定的 UI 逻辑暴露给模板。
Controller(控制器):控制器的首要任务就是初始化$scope 对象。在实践中,初始化的逻辑由下面的这些责任组成:提供模型初始化的值;扩展$scope UI 行为(方法)。
控制器都是普通的 JavaScript 函数,它们并不必去继承一些框架特定提供的类,也不必去调用任何特定的 AngularJS API 才能去正确地执行它们的任务。
Directive(指令):指令可以用来创建自定义的标签,它们可以用来装饰元素或者操作 DOM 属性,也可以作为标签、属性、注释和类名使用。
使用 AngularJs 的几个理由简单容易上手,将会由下个章节的几个例子来证明 AngularJs 的简单易用。
有谷歌团队支持的开源框架。
非常全面,涵盖了 Unit Test、HTML 模板、数据绑定等性质,是一个非常快速的前端开发解决方案。
返回列表