angularjs2.0技术的研究与应用(源码)【字数：17308】
摘 要随着网络技术的飞速发展，Web前端变得空前强大和复杂，大规模的JavaScript项目也随处可见。TypeScript将趋近成熟的类型系统引入到了JavaScript中，从而使大型JavaScript项目的开发体验焕然一新。经过时间的积累，TypeScript周围的生态环境也日趋成熟。为了紧跟JavaScript社区的发展，TypeScript时刻关注着社区动态。在过去的一年中，TypeScript一直在不断更新优化便于解决社区不断提出的新需求。从Angular2.0版本起完全采用TypeScript开发并将充分发挥了TypeScript的优点。本文依托于问卷调查系统，使用Angular2.0技术实现了用户的登录、注册、问卷的预览、编辑、发布、回收以及删除等功能，以深入研究Angular2.0技术的组件、指令、服务和路由等功能特性。通过对该问卷调查系统的了解与学习，可以对Angular2.0技术的核心模块以及框架理念得到充分的认识和理解。
目 录
第一章 绪论 1
1.1 研究背景 1
1.2 研究意义 1
1.3 研究的内容 2
1.4 论文的结构 2
第二章 相关技术 4
2.1 AngularJS 1.x 4
2.1.1 AngularJS1.x的迭代之路 4
2.1.2 AngularJS的困境 4
2.2 Angular 2.0技术 5
2.2.1 Angular 2.0与AngularJS1.x的区别 5
2.2.2 Angular 2.0的核心概念 6
2.2.3 Angular 2.0技术开发优势 7
第三章 基于Angular 2.0的应用模型设计 10
3.1 需求分析 10
3.2 系统设计 11
3.2.1 设计方案 11
3.2.2 功能流程 12
3.2.3 模块划分 12
第四章 应用实现 15
4.1 开发与运行环境 15
4.1.1 硬件实现环境 15
4.1.2 软件环境 15< *好棒文|www.hbsrm.com +Q: &351916072&
br /> 4.2 功能模块实现 15
4.2.1 首页和帮助页 15
4.2.2 问卷编辑模块 17
4.2.3 我的问卷模块 24
4.2.4 用户管理模块 25
第五章 系统测试与分析 28
5.1 测试环境 28
5.1.1 测试概述 28
5.1.2 测试技术与工具 28
5.2 测试方案 28
5.2.1 测试内容 28
5.2.2 单元测试 28
5.2.3 端对端测试 30
5.2.4 功能模块测试 31
结束语 40
致 谢 41
参考文献 42
绪论
研究背景
随着互联网的蓬勃发展，云计算、大数据、物联网等业务的不断发展，互联网已成为人们工作和学习生活的重要组成部分。互联网的发展不断改变着人们的生活方式。从上世纪70年代互联网的出现开始，富有创造力的人们便开始了各种有趣的尝试。
就职于网景公司的Brendan Eich在1995年为Netscape Navigator2.0创造了JavaScript。最初的时期，由于受到当时网站的开发模式的限制，JavaScript的价值有限。随着微软IE3.0和JScript的出现，不同版本的浏览器端脚本语言促进了后续JavaScript语言标准化的建立。接着ECMA262标准定义了ECMAScript（简称ES）这门全新的脚本语言。随后，ECMAScript3、IE5和HTML4.01相继发布。在Google公司发布的Gmail中，使用了与服务器高度互动的JavaScript脚本，以获得更好的局部刷新效果，使交互体验更接近常规软件。随后在一篇文章中将这些技术命名为AJAX（Asynchronous JavaScript And XML），AJAX也成为了现在Web开发的标准做法。
随着前端生态社区的快速发展，大型前端架构的深入实践与工程化等新问题被不断提出。当时，人们为了追求更快的页面访问体验，提出了单页Web应用（Single Page Application，简称SPA）的概念，随后前端社区中各类架构概念的迁移与实践也不断出现。
研究意义
ESMAScript6这一新标准的正式发布给开发者们带来了许多新的特性与语法，以及许多现有特性的强有力扩展。这意味着前端将步入一个新的时代。在其他前端框架社区高速发展与新标准诞生的时期里，AngularJS正背负着臃肿的架构、过时的概念和低效的性能问题等沉重的历史包袱，此时，Angular2正缓缓地走入人们的视线。
Angular2从整体上相较于AngularJS[1]来说更加的简洁，只剩下一个最核心的概念——组件，同时Angular2其他部分都是围绕着Component展开的。Angular2删除了$scope[2]的概念。在Angular1.x里，$scope对于开发者来说是一个强大而又可怕的东西，Angular2接受了社区的建议，删除了$scope，同时在Angular2里引入了zone.js，因此开发者即使在回调函数中修改数据模型也不需要手动$apply()[2]。此外，Angular2还删除了ngcontroller指令跟大幅度演进了脏值检测机制，不仅引入了单向绑定，还引入了各种绑定的策略。在Angular1.x中，不能嵌套官方的路由器，导致开发者在开发的过程中不得不依赖第三方的uiroter库。由于Angular2[3]的路由是基于Component的，所以完美解决了嵌套路由的问题。同时Angular2改造了依赖注入机制，相似于Java中的注解。Angular2的框架整体上是基于TypeScript开发的，这是Angular2对于Angular1.x最大的变更[4]。
随着新技术在前端技术中的普及，学习成本也越来越高，这也意味着越来越多的事情可以做，新的机遇和挑战并存。本文将深入了解Angular2的历史与框架，根据Angular2的核心模块设计一个调查问卷系统，以便于进一步理解Angular2的核心模块以及框架理念。
目 录
第一章 绪论 1
1.1 研究背景 1
1.2 研究意义 1
1.3 研究的内容 2
1.4 论文的结构 2
第二章 相关技术 4
2.1 AngularJS 1.x 4
2.1.1 AngularJS1.x的迭代之路 4
2.1.2 AngularJS的困境 4
2.2 Angular 2.0技术 5
2.2.1 Angular 2.0与AngularJS1.x的区别 5
2.2.2 Angular 2.0的核心概念 6
2.2.3 Angular 2.0技术开发优势 7
第三章 基于Angular 2.0的应用模型设计 10
3.1 需求分析 10
3.2 系统设计 11
3.2.1 设计方案 11
3.2.2 功能流程 12
3.2.3 模块划分 12
第四章 应用实现 15
4.1 开发与运行环境 15
4.1.1 硬件实现环境 15
4.1.2 软件环境 15< *好棒文|www.hbsrm.com +Q: &351916072&
br /> 4.2 功能模块实现 15
4.2.1 首页和帮助页 15
4.2.2 问卷编辑模块 17
4.2.3 我的问卷模块 24
4.2.4 用户管理模块 25
第五章 系统测试与分析 28
5.1 测试环境 28
5.1.1 测试概述 28
5.1.2 测试技术与工具 28
5.2 测试方案 28
5.2.1 测试内容 28
5.2.2 单元测试 28
5.2.3 端对端测试 30
5.2.4 功能模块测试 31
结束语 40
致 谢 41
参考文献 42
绪论
研究背景
随着互联网的蓬勃发展，云计算、大数据、物联网等业务的不断发展，互联网已成为人们工作和学习生活的重要组成部分。互联网的发展不断改变着人们的生活方式。从上世纪70年代互联网的出现开始，富有创造力的人们便开始了各种有趣的尝试。
就职于网景公司的Brendan Eich在1995年为Netscape Navigator2.0创造了JavaScript。最初的时期，由于受到当时网站的开发模式的限制，JavaScript的价值有限。随着微软IE3.0和JScript的出现，不同版本的浏览器端脚本语言促进了后续JavaScript语言标准化的建立。接着ECMA262标准定义了ECMAScript（简称ES）这门全新的脚本语言。随后，ECMAScript3、IE5和HTML4.01相继发布。在Google公司发布的Gmail中，使用了与服务器高度互动的JavaScript脚本，以获得更好的局部刷新效果，使交互体验更接近常规软件。随后在一篇文章中将这些技术命名为AJAX（Asynchronous JavaScript And XML），AJAX也成为了现在Web开发的标准做法。
随着前端生态社区的快速发展，大型前端架构的深入实践与工程化等新问题被不断提出。当时，人们为了追求更快的页面访问体验，提出了单页Web应用（Single Page Application，简称SPA）的概念，随后前端社区中各类架构概念的迁移与实践也不断出现。
研究意义
ESMAScript6这一新标准的正式发布给开发者们带来了许多新的特性与语法，以及许多现有特性的强有力扩展。这意味着前端将步入一个新的时代。在其他前端框架社区高速发展与新标准诞生的时期里，AngularJS正背负着臃肿的架构、过时的概念和低效的性能问题等沉重的历史包袱，此时，Angular2正缓缓地走入人们的视线。
Angular2从整体上相较于AngularJS[1]来说更加的简洁，只剩下一个最核心的概念——组件，同时Angular2其他部分都是围绕着Component展开的。Angular2删除了$scope[2]的概念。在Angular1.x里，$scope对于开发者来说是一个强大而又可怕的东西，Angular2接受了社区的建议，删除了$scope，同时在Angular2里引入了zone.js，因此开发者即使在回调函数中修改数据模型也不需要手动$apply()[2]。此外，Angular2还删除了ngcontroller指令跟大幅度演进了脏值检测机制，不仅引入了单向绑定，还引入了各种绑定的策略。在Angular1.x中，不能嵌套官方的路由器，导致开发者在开发的过程中不得不依赖第三方的uiroter库。由于Angular2[3]的路由是基于Component的，所以完美解决了嵌套路由的问题。同时Angular2改造了依赖注入机制，相似于Java中的注解。Angular2的框架整体上是基于TypeScript开发的，这是Angular2对于Angular1.x最大的变更[4]。
随着新技术在前端技术中的普及，学习成本也越来越高，这也意味着越来越多的事情可以做，新的机遇和挑战并存。本文将深入了解Angular2的历史与框架，根据Angular2的核心模块设计一个调查问卷系统，以便于进一步理解Angular2的核心模块以及框架理念。
版权保护: 本文由 hbsrm.com编辑，转载请保留链接: www.hbsrm.com/jsj/rjgc/102.html
