angular简介和其特点介绍

这篇文章主要介绍了angular简介和其特点介绍,本文讲解了关于和jquery的比较、关于适用场合、关于UI的结合、关于angularjs的特点等内容,需要的朋友可以参考下以前开发(web或者移动端)前端主要使用jQuery+原生js,如果使用某些前端UI框架的话,它自己还可能提供一些API可以使用。而且目前很多UI框架都是基于jQuery的,所以说一下由jQuery跨到angularjs跨度较大,研究了一段时间的angularjs ,下面从整体上说说感受吧:

    关于和jquery的比较

首先angular是一个mvc框架,它与jquery不同之处在于,前者致力于mvc代码解耦,采用model,controller以及view方式去组织代码,而后者提供给你了很多APi函数,你可以不用写很多原生js去实现比较复杂的效果,比如说动画,$.animate,这样的效果如果需要原生js来写的话,代码量将会比较庞大;

其次,jQuery没有定义你的代码如何组织,你可以将它放在一个单独的js文件中进行引用,也可以直接写在页面中采用script标签进行包裹,甚至可以直接以内联的方式写在html标签中,但是angularjs会将一个HTML页面分成若干个模块,每个模块都可以自己的scope,service以及directive,各个模块之间也可以进行通信,但是整体上结构是比较清晰的,就是说其代码组织方式是模块化的。

最后,jQuery的思想是先设计好页面,然后在已有页面的基础上进行dom操作后展示页面,但是angular的view可能仅仅是一个框架,对view的dom操作或者时间监听都是在directive中实现的,而且一般情况下很少自己直接去写Dom操作代码,只要你监听model。model发生变化后view也会发生变化。

    关于适用场合

jQuery应该适用于大多数web开发,移动端也有(jQuerymobile),angularjs有人说更适合做SPA(我个人认为在手机上的SPA可能会引发性能上的问题,因为它的脏检查机制会影响性能),在web端,一些CRUD的应用或者管理类软件还是可以使用的(当然这里的理解可能不一定准确,会随着深入学习更多去了解和使用)。

    关于UI的结合

开发任何产品都需要用到前端UI,目前很多UI是基于jQuery的,这意味着你如果要用angularjs和这些Ui组件的话,需要用angularjs的directive去重写些组件,这一过程是比较麻烦的,所幸的是,angular给我们提供了一些UI组件可以使用(web端主要是结合bootstrap前端组件),http://angular-ui.github.io/,而在移动端主要是结合ionic框架http://ionicframework.com/,但是随着angular的发展,很多HTML5的前端框架也慢慢集成了angularjs版本可供使用。

    关于angularjs的特点

1.数据的双向绑定:这可能是其最激动人心的特性吧,view层的数据和model层的数据是双向绑定的,其中之一发生更改,另一方会随之变化,这不用你写任何代码!(想想jQuery方式下怎么做吧)

2.代码模块化,每个模块的代码独立拥有自己的作用域,model,controller等。

3.强大的directive可以将很多功能封装成HTML的tag,属性或者注释等,这大大美化了HTML的结构,增强了可阅读性;

4.依赖注入,将这种后端语言的设计模式赋予前端代码,这意味着前端的代码可以提高重用性和灵活性,未来的模式可能将大量操作放在客户端,服务端只提供数据来源和其他客户端无法完成的操作;

5.测试驱动开发,angularjs一开始就以此为目标,使用angular开发的应用可以很容易地进行单元测试和端对端测试,这解决了传统的js代码难以测试和维护的缺陷

以上就是研究angularjs一段时间得出的结论,其中某些地方可能有所疏漏,没关系,接下来会展开其中某一点一步步去学习。

时间: 2024-10-12 23:00:22

angular简介和其特点介绍的相关文章

angular简介和其特点介绍(上)

这篇文章主要介绍了angular简介和其特点介绍,本文讲解了关于和jquery的比较.关于适用场合.关于UI的结合.关于angularjs的特点等内容,需要的朋友可以参考下以前开发(web或者移动端)前端主要使用jQuery+原生js,如果使用某些前端UI框架的话,它自己还可能提供一些API可以使用.而且目前很多UI框架都是基于jQuery的,所以说一下由jQuery跨到angularjs跨度较大,研究了一段时间的angularjs ,下面从整体上说说感受吧: 关于和jquery的比较 首先an

CloudStack(一)简介及相关理论介绍

简介 CloudStack(cloudstack.apache.org)是IaaS类型云计算的一种开源解决方案,同类的解决方案有OpenStack.OpenNebula等,CloudStack是以java语言所研发并具有高可用性.可扩展性.丰富的UI功能.Hypervisor 的多样性等等..(更多请见http://www.cloudstack-china.org/2013/11/2702.html),它可以帮助用户利用自己的硬件提供类似于Amazon EC2那样的公共云服务.CloudStac

angular简介

1.angular简介 一款非常优秀的前端高级 JS 框架 由 Misko Hevery 等人创建 2009 年被 Google 公式收购,用于其多款产品 有一个全职的开发团队继续开发和维护这个库 有了这一类框架就可以轻松构建 SPA 应用程序 通过指令扩展了 HTML,通过表达式绑定数据到 HTML. 2.angular的优点 -- Angular 最大程度的减少了页面上的 DOM 操作: -- 让 JavaScript 中专注业务逻辑的代码: -- 通过简单的指令结合页面结构与逻辑数据: -

IPv6 简介以及位址介绍

IPv6 简介 IPv6(IP版本6)是互联网通讯协议(Internet Protocol,简称IP)的新版本,它被设计来取代IPv4.并且针对当初设计IPv4时没有考虑到的问题做了以下改进: 扩展地址空间  IPv6将IP地址长度从32 bits扩展到128 bits,其主要目的是支持更多层的阶层式的路由架构,更大的地址空间(IPv6的地址不再有耗尽之虑),并且提供更简单的自动组态配置.在multicast address中新增 "scope" 字段来提升multicast rout

ActionBar(17)context action bar简介,启动,各函数介绍

一.Context Action Bar简介 它是一个ActionBar,有各种操作项,但它不是始终显示的ActionBar,它需要上下文才显示.样式如下: 二.Context Action Bar的启动 有多种启动context action bar的方式,常见的如下: 1:通过activity的ActionMode startActionMode(ActionMode.Callback callback)启动 2:listview的setChoiceMode(int choiceMode) 

Angular简介与程序架构

什么是angularJs 1.基于javascript开发的客户端应用框架,使我们可以更加快捷,简单的开发web应用.  2.诞生于2009年,后来被google收购,用在了很多项目中.  3.适用于CRUD应用或者SPA单页面网站的开发. 4.不太适合做游戏开发和页面特效的开发. 二.langularJs资源 http://www.angularjs.org/    需要FQ才能访问 https://www.github.com/angular/ http://www.angularjs.cn

阿里云 Angular 2 UI框架 NG-ZORRO介绍

说明: Angular2出来后,一直想找个基于Angular2的前端后台管理框架,但一直没有找到比较适合的.前段时间在Angular官网资源无意之间看到NG-ZORRO,NG-ZORRO由阿里计算平台事业部.阿里云等不同部门的一些小伙伴在原业务组件的基础上共同构建而成,而且已开源,现在是0.6.0的版本,组件功能已经很齐全了,更符合我们国人使用习惯,已兼容Angular 5.0版本.是目前为止我见过的最全面.最好.最符合国人使用习惯的管理后台angular 2 UI模板. 文档查看官方网站:ht

Angular:OnPush变化检测策略介绍

在OnPush策略下,Angular不会运行变化检测(Change Detection ),除非组件的input接收到了新值.接收到新值的意思是,input的值或者引用发生了变化.这样听起来不好理解,看例子: 子组件接收一个balls(别想歪:))输入,然后在模板遍历这个balls数组并展示出来.初始化2秒后,往balls数组push一个new ball: //balls-list.component.ts @Component({ selector: 'balls-list', templat

gcc之__attribute__简介及对齐参数介绍

GNU C的一大特色就是__attribute__机制.__attribute__机制可以设置函数属性(Function Attribute).变量属性(Variable Attribute)和类型属性(Type Attribute). __attribute__语法格式为:__attribute__((attribute-list)). __attribute__对结构体(struct)或共用体(union)进行属性设置: 大致有六个参数值可以被设定,即:aligned,packed,tran