热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

是否有必要学习angular

说下自己的情况。开发前端主要用bootstrap,jquery,ajax。效果动画表单验证什么的也是jq。后台主要用thinkphp。前段时间想搜一下更好的前端框架,看到angular。但是学习了一段时间感觉非常困惑。那篇神问答也看了...
说下自己的情况。
开发前端主要用bootstrap,jquery,ajax。效果动画表单验证什么的也是jq。
后台主要用thinkphp。

前段时间想搜一下更好的前端框架,看到angular。但是学习了一段时间感觉非常困惑。
那篇神问答也看了三四遍,主要的核心就是不要操作DOM。但是按照angular的写法,扩展每个html标签,这样对比jquery那种html和js分离的写法貌似没任何优势啊。

第二个就是数据双向绑定,感觉也是用处不大,不论是表单验证还是其它动画效果感觉jq无压力啊。

还有个疑问就是MVC,为什么不用tp的mvc,而要用angular在前端再分离一次,这样有什么好处呢,假如我要循环

    下的
  • ,常规用tp可以直接foreach,但是用angular就必须写成这样:


    • {{**}}

    这样将数据写在js里面,sql出的数据怎么分配呢,岂不给自己找不自在?

    那为什么那么多人在用angular,她到底好在哪里呢?

    回复内容:

    说下自己的情况。
    开发前端主要用bootstrap,jquery,ajax。效果动画表单验证什么的也是jq。
    后台主要用thinkphp。

    前段时间想搜一下更好的前端框架,看到angular。但是学习了一段时间感觉非常困惑。
    那篇神问答也看了三四遍,主要的核心就是不要操作DOM。但是按照angular的写法,扩展每个html标签,这样对比jquery那种html和js分离的写法貌似没任何优势啊。

    第二个就是数据双向绑定,感觉也是用处不大,不论是表单验证还是其它动画效果感觉jq无压力啊。

    还有个疑问就是MVC,为什么不用tp的mvc,而要用angular在前端再分离一次,这样有什么好处呢,假如我要循环

      下的
    • ,常规用tp可以直接foreach,但是用angular就必须写成这样:


      • {{**}}

      这样将数据写在js里面,sql出的数据怎么分配呢,岂不给自己找不自在?

      那为什么那么多人在用angular,她到底好在哪里呢?

      学不学Angularjs不是重点,重点的是要学MVVM这一套逻辑(后面会说明这是什么),而Angular刚好是这套逻辑最成熟的方案,所以很多人会建议你学Angularjs,其实还有Ember, Aurelia等等,都是很不错的MVVM框架。
      举个例子(Angularjs):
      像你写的遍列数据,如果用jQuery,那么需要这样:

      //foo is Array
      foo.forEach(function(eachFoo){
          $ul.append('
    • ' + eachFoo + '
    • '); });

      而Angularjs需要在html上面写,也就是用指令:

      • {{eachFoo}}

      一般不继续处理foo变量的话,显然是jQuery会比较方便,但万一你需要删除foo里的变量呢?在jquery中需要两步:
      第一删除变量:

      var index = 1; //需要删除变量的位置
      foo.splice(index, 1);

      第二删除dom元素:

      $ul.find('li:eq(' + index + ')').remove();
      //实际操作会复杂得多

      而在Angular中,只需要在controller中把foo指定的变量删除就可以了,也就是上面jquery的第一步,但写法有点不同。

      var index = 1;
      $scope.foo.splice(index, 1);

      之后就不必再去管dom元素了,它会自动把变量对应的dom元素删掉。同样,如果要增加变量,只需继续在foo里push(新变量)就可以了,而jQuery却不同,它不仅需要push,还要append,甚至还需要知道push到那里了。

      看到这里,你大概就能理解为什么这么多人喜欢Angularjs了,因为有了它你就不必再操心dom元素了(这是一件十分痛苦的事情,特别是数据特别多的时候),你只需定义好了指令,然后直接操作$scope里的变量就可以了,这是一件多么舒心省事的事情。

      回到MVVM来,这是什么鬼?MVVM其实就是model view - view model,也就是数据与视图的绑定,操作数据等同于操作视图,操作视图也等同于操作数据,也就是传说中的双向绑定。

      再回到你的问题来,需不需要学习Angularjs,我认为是需要的。无论项目大小,anguarjs完全可以取代jquery,况且angularjs里包含了jquery(迷你版,尽量少用)。学习并不困难,我大概花了两个星期就入门了,建议照着官方文档案例学习https://docs.angularjs.org/tutorial,写得相当好。

      表单验证对于angular来说比jquery更有优势,因为你根本不必处理用户输入错误时dom如何处理,你只需定义好指令让angular来处理就好了(可以结合validator第三方包来处理,更是简单得要命)。

      至于动画,angular比jquery还简单点,因为全是用css来写的,与jquery那些fadein fadeout有点不同。更爽的是,只要css定义好了,你所有dom的出现和消失都是带有动画的,比jquery每个dom都写一个动画简单得多。更是因为css动画是有GPU加成的(transform3d),比jquery流畅不是一点点。

      但angular并不是完美,有些缺点你必须接受,如果你项目SEO比较依赖,用Angular稍微麻烦点,因为view基本上是js来操作了,搜索引擎是看不到的(解决办法也是极为复杂),特别是用了route的,做SEO更是困难。所以很多时候Angular大多用在移动端或者APP,桌面端比较少用(并不是完全没用,主要是jquery现在用的人太多)。

      扩展:
      React比angular稍微复杂点,涉及到一个虚拟dom的知识点,它是直接在js中写html,连指令也不用写,最大的好处是执行效率相当高。我刚开始接触,还没真正用上,有机会再研究研究。

      另外你说到了bootstrap,这是UI框架,主要负责外观,跟jquery angular区别还蛮大的。

      另,我写了个云相册,刚开始是用jquery写的,现在正慢慢迁移到angular来,有兴趣可以看看:http://www.lazycoffee.com

      我也是刚接触Angularjs不久,为避免误人子弟,请别转载

      Angular最好的地方就是能让你向写后台代码一样的写前端代码
      template和Controller 基本上可以实现经典mvc的形式

      为什么要用它呢
      1 - 学习门槛低 简单易用
      2 - 确实让代码更好维护
      3 - 双向绑定还是很方便的
      4 - 如果你用Ionic 你躲不开Angular
      5 - 如果你写移动端的WebApp angular可以一次加载 更快的装载处理各级子页

      我也是做后端php开发的,前段时间想做一个项目,前端希望考虑用angular,于是就学习了一把,心得是

      1.思想很牛,把mvc整合到了前端开发,维护起来很容易
      2.但项目如果不是太大的话就不要考虑这个东西


      我不是专业做前端的,可能对于angular掌握的不是特别好,但好像最近很久一段时间react貌似很火的样子,对于处理dom很牛叉,如果可以在angular抽出身,弄弄那个貌似不错

      个人意见

      angular是针对那种【后台只写接口,前端根据接口返回的值自己处理逻辑】的APP式页面的
      你把逻辑都交给后台,前台大部分操作都提给后台,php动态生成页面这种格式当然觉得无必要。

      双向数据绑定简直相当有用啊,你觉得没有用可能是你还没有遇到相应的情况。比如说你有一js二维数组想要以表格的形式展示在html模型上,而模型上还要给这表格加上增删查改等功能。用angularjs之后你需要做的仅仅只是操作一下js二维数组,不用做任何的dom操作,就能达到目的。
      不过angularjs却与html和js代码分离的规范相背离确实是个问题。

      赞同一楼的观点,学习一套框架,更多的去学习其中的思想。很多知识是相通的,学习了angularjs算是知识储备。就比如大学先学习c语言C#,后来学习java就会感觉容易很多

推荐阅读
  • 本文介绍了前端人员必须知道的三个问题,即前端都做哪些事、前端都需要哪些技术,以及前端的发展阶段。初级阶段包括HTML、CSS、JavaScript和jQuery的基础知识。进阶阶段涵盖了面向对象编程、响应式设计、Ajax、HTML5等新兴技术。高级阶段包括架构基础、模块化开发、预编译和前沿规范等内容。此外,还介绍了一些后端服务,如Node.js。 ... [详细]
  • Java实战之电影在线观看系统的实现
    本文介绍了Java实战之电影在线观看系统的实现过程。首先对项目进行了简述,然后展示了系统的效果图。接着介绍了系统的核心代码,包括后台用户管理控制器、电影管理控制器和前台电影控制器。最后对项目的环境配置和使用的技术进行了说明,包括JSP、Spring、SpringMVC、MyBatis、html、css、JavaScript、JQuery、Ajax、layui和maven等。 ... [详细]
  • 从零基础到精通的前台学习路线
    随着互联网的发展,前台开发工程师成为市场上非常抢手的人才。本文介绍了从零基础到精通前台开发的学习路线,包括学习HTML、CSS、JavaScript等基础知识和常用工具的使用。通过循序渐进的学习,可以掌握前台开发的基本技能,并有能力找到一份月薪8000以上的工作。 ... [详细]
  • 本文介绍了DataTables插件的官方网站以及其基本特点和使用方法,包括分页处理、数据过滤、数据排序、数据类型检测、列宽度自动适应、CSS定制样式、隐藏列等功能。同时还介绍了其易用性、可扩展性和灵活性,以及国际化和动态创建表格的功能。此外,还提供了参数初始化和延迟加载的示例代码。 ... [详细]
  • 本文介绍了C#中数据集DataSet对象的使用及相关方法详解,包括DataSet对象的概述、与数据关系对象的互联、Rows集合和Columns集合的组成,以及DataSet对象常用的方法之一——Merge方法的使用。通过本文的阅读,读者可以了解到DataSet对象在C#中的重要性和使用方法。 ... [详细]
  • 在说Hibernate映射前,我们先来了解下对象关系映射ORM。ORM的实现思想就是将关系数据库中表的数据映射成对象,以对象的形式展现。这样开发人员就可以把对数据库的操作转化为对 ... [详细]
  • Voicewo在线语音识别转换jQuery插件的特点和示例
    本文介绍了一款名为Voicewo的在线语音识别转换jQuery插件,该插件具有快速、架构、风格、扩展和兼容等特点,适合在互联网应用中使用。同时还提供了一个快速示例供开发人员参考。 ... [详细]
  • 高质量SQL书写的30条建议
    本文提供了30条关于优化SQL的建议,包括避免使用select *,使用具体字段,以及使用limit 1等。这些建议是基于实际开发经验总结出来的,旨在帮助读者优化SQL查询。 ... [详细]
  • 导出功能protectedvoidbtnExport(objectsender,EventArgse){用来打开下载窗口stringfileName中 ... [详细]
  • 本文是关于C#类型系统、值类型和引用类型的概念性笔记。介绍了C#1系统类型的三个特性,静态类型的含义,显式类型和隐式类型的区别。还讨论了类、结构、数组类型、枚举、委托类型和接口类型属于哪一种类型。同时纠正了关于结构、引用类型和对象传递的错误表述。最后提到了C#4中使用动态类型的关键字。 ... [详细]
  • MySQL中的MVVC多版本并发控制机制的应用及实现
    本文介绍了MySQL中MVCC的应用及实现机制。MVCC是一种提高并发性能的技术,通过对事务内读取的内存进行处理,避免写操作堵塞读操作的并发问题。与其他数据库系统的MVCC实现机制不尽相同,MySQL的MVCC是在undolog中实现的。通过undolog可以找回数据的历史版本,提供给用户读取或在回滚时覆盖数据页上的数据。MySQL的大多数事务型存储引擎都实现了MVCC,但各自的实现机制有所不同。 ... [详细]
  • HTML5网页模板怎么加百度统计?
    本文介绍了如何在HTML5网页模板中加入百度统计,并对模板文件、css样式表、js插件库等内容进行了说明。同时还解答了关于HTML5网页模板的使用方法、表单提交、域名和空间的问题,并介绍了如何使用Visual Studio 2010创建HTML5模板。此外,还提到了使用Jquery编写美好的HTML5前端框架模板的方法,以及制作企业HTML5网站模板和支持HTML5的CMS。 ... [详细]
  • 在C#中,使用关键字abstract来定义抽象类和抽象方法。抽象类是一种不能被实例化的类,它只提供部分实现,但可以被其他类继承并创建实例。抽象类可以用于类、方法、属性、索引器和事件。在一个类声明中使用abstract表示该类倾向于作为其他类的基类成员被标识为抽象,或者被包含在一个抽象类中,必须由其派生类实现。本文介绍了C#中抽象类和抽象方法的基础知识,并提供了一个示例代码。 ... [详细]
  • Unity3D引擎的体系结构和功能详解
    本文详细介绍了Unity3D引擎的体系结构和功能。Unity3D是一个屡获殊荣的工具,用于创建交互式3D应用程序。它由游戏引擎和编辑器组成,支持C#、Boo和JavaScript脚本编程。该引擎涵盖了声音、图形、物理和网络功能等主题。Unity编辑器具有多语言脚本编辑器和预制装配系统等特点。本文还介绍了Unity的许可证情况。Unity基本功能有限的免费,适用于PC、MAC和Web开发。其他平台或完整的功能集需要购买许可证。 ... [详细]
  • mui框架offcanvas侧滑超出部分隐藏无法滚动如何解决
    web前端|js教程off-canvas,部分,超出web前端-js教程mui框架中off-canvas侧滑的一个缺点就是无法出现滚动条,因为它主要用途是设置类似于qq界面的那种格 ... [详细]
author-avatar
jerry827900
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有