`

论angular的“强大”之处

 
阅读更多

最近看知乎,好有多讨论ng的,有观望准备学习的,也有使用中传播经验的。

 

我们公司算是大范围用(金融类核心系统,ng的业务相关的代码量在百万级别),ng的经验算是积累了些,写这篇blog发表下我的一些看法。

 

1. 如题目说angular是强大的,这里是有应用场景做背景的,双向绑定很多框架都能做,但

scope的设计 + 容器思想 + 双向绑定这些特性组合起来,更适合复杂的web开发场景:组件化,解耦。

 

2. angular官方介绍的首先提出的是增强的html语法,组件化技术也有很多,和服务端驱动相比,处理视图部分ng的理念应该是标记语言+ 声明式更适合UI,简单很重要。做一样的功能,抽象UI对象,用命令过程式编程驱动开发,比起html/css不够简单,灵活。(这方面很多流派,前端、后端的很多,这里是表达个人看法)

 

3. 扩展、灵活性很高,但方式约束性强

  a) 和第三方库的兼容使用上,虽然有个the angular way,但不妨碍和一些成熟的库结合,如地图、编辑器,图表

  b) compile link的api足够应付各种复杂、灵活的需求(动态的模板,动态的模型)

  c) the angular way还是约束很多的,这样也有利于大家保持一致的编码风格,这个对于大点的项目来说很重要

 

4. 强大可扩展的校验机制——围绕ngModelController/ngForm构建的绑定拦截和校验机制,真是太灵活了

 这些设计做业务系统把模型和校验分离得很清楚啊

$parsers/$formatters

$setViewVal

$errors/$invalid/$valid

$pristine/$dirty

 

当然也有吐槽的地方,比如:

1. ng-options生成的option没有title,要自己加指令做dom操作

2. ng-options性能差啊,我们重写了用html拼接实现的简化版,借鉴了dom重用思路

3. bootstrap不支持嵌套dom,我们都是先把模板放在body下的平级,隐藏,编译后,然后做dom操作形成父子结构

4. 为什么有上面一条,是因为angular不支持“热插拔”,bootstrap之前,必须所有的directive/controller/filter/service都到位的,但不是所有的应用都是SPA,一个应用的js/html的定义有延迟加载的情况

5. ng-repeat性能差啊,bindonce只能一定程度上缓解,很多时候我们用html字符串模板 + 事件代理方式处理,包装成双向绑定形式给开发者用

6. 有时候还需要用同步ajax的

 

 

 

 

 

分享到:
评论

相关推荐

    Angular.js v1.8.3.zip

    Angular.js 是一个强大的JavaScript框架,由Google维护,用于构建单页应用(Single Page Applications, SPA)。这个版本,v1.8.3,是Angular.js的一个稳定版本,它提供了丰富的功能和改进,帮助开发者构建高性能、可...

    NestJS-Angular

    而 Angular 则是 Google 推出的一款强大的前端框架,用于构建单页应用程序(SPA),它支持组件化开发,提供了丰富的特性如依赖注入、路由、表单处理等。 在这个名为 "NestJS-Angular" 的项目中,我们可以推测这是一...

    bpm-console-gui:用 Angular.js 构建的 Activiti 控制台前端项目

    Angular.js是由Google维护的一个强大的MVC(Model-View-Controller)框架,适用于构建复杂的单页应用程序,它提供了数据绑定、依赖注入和模块化等功能,便于开发高效且可维护的前端代码。 **标签解释:** ...

    sidebar-menu:基于 Angular UI Bootstrap 的侧边栏菜单

    在本文中,我们将深入探讨如何使用Angular UI Bootstrap创建一个基于组件的侧边栏菜单。Angular UI Bootstrap是一个由AngularJS社区维护的项目,它为AngularJS应用程序提供了Bootstrap组件的实现,使得开发者可以...

    前端资料修改v1,待修正,自己看

    Angular命令行接口(CLI)是开发过程中的强大工具,它可以帮助快速生成新项目、组件、服务等,并且支持自动化构建、测试和部署。 然而,压缩包中的文件名称与Angular框架本身并无直接关系。"高校毕业生就业管理...

    Follow Me通读Angular权威教程之TypeScript

    Angular,一个强大的前端框架,是由Google维护并广泛应用于构建现代Web应用程序的。它以其模块化、组件化以及丰富的功能特性而备受赞誉。然而,Angular的基石并非传统的JavaScript,而是使用了一种名为TypeScript的...

    Angular-Rest-Client:Angular的REST客户端

    AngularJS(通常称为Angular 1.x)是Google开发的一款强大的前端JavaScript框架,用于构建单页应用(SPA)。它通过双向数据绑定、依赖注入和指令等特性,极大地提高了开发效率和代码可维护性。 ### REST API REST...

    DesignPad_Angular10_firebase

    在IT领域,设计板是一个用于创建、测试和展示用户界面的工具,而结合Angular10框架和Firebase的解决方案则为开发者提供了一个强大的平台来快速构建动态Web应用。Angular10是Google推出的前端开发框架,以其组件化、...

    angular-978-1-7864-6547-4:Angular 测试驱动开发 - 第二版

    Angular,作为一款由Google维护的前端框架,以其强大的功能和组件化设计深受开发者的喜爱。它提供了丰富的特性,如数据绑定、依赖注入、路由、表单处理等,极大地简化了Web应用的开发。测试驱动开发是一种软件开发...

    AngularTDD:Angular TDD项目

    Angular的主要特点包括组件化、依赖注入、双向数据绑定以及强大的指令系统。 **2. 测试框架** 在AngularTDD项目中,主要使用的测试工具有: - **Mocha**:Mocha是一个功能丰富的JavaScript测试框架,可以在Node....

    desarrollo-web-agil-con-angular:敏捷的Web开发课程

    在敏捷开发中,Angular是一个强大的工具。Angular框架提供了一套完整的解决方案,包括数据绑定、依赖注入、指令系统、表单处理和路由等功能,使得开发人员可以更快速地构建动态、交互式的Web界面。它使用TypeScript...

    angular-test

    在IT行业中,Angular是一款非常流行的前端开发框架,尤其在构建复杂单页应用程序(SPA)时。这个名为"angular-test"的项目显然与Angular 2.0版本的测试有关,这将涉及JavaScript编程语言以及可能的测试工具和技术。...

    博客论文列表:分系列整理.zip

    例如,这些系列可能包括JavaScript基础知识、DOM操作、AJAX、异步编程、ES6新特性、React框架、Vue框架、Angular框架、Node.js服务器开发、Websocket实时通信等。 标签“JavaScript”进一步确认了这些博客论文的...

    angular-utils:AngularJS 项目中使用的不同自定义工具@ Fasconnect

    AngularJS 的强大之处之一在于其自定义指令机制,这使得开发者可以扩展HTML语法,创建新的元素或属性。angular-utils可能包含了多个自定义指令,如表单验证指令、动态加载内容指令等,这些都可以帮助开发者更便捷地...

    Angular-Exercici-2-1-i-3

    管道(Pipes)是Angular中的一个强大工具,用于在模板中对数据进行转换,比如日期格式化、货币转换等。在练习项目中,可能会看到自定义管道的实现,以满足特定的数据处理需求。 指令(Directives)扩展了HTML,让开发者...

    angular-tdd:用角度进行测试驱动的开发

    Angular是由Google维护的一个开源框架,它基于TypeScript构建,提供了强大的数据绑定和依赖注入功能,使得开发者能够更轻松地创建单页应用(SPA)。在Angular中,TDD可以帮助确保代码的质量,减少错误,并提高整体...

    毕业设计论文管理系统.zip

    2. **前端技术**:前端界面可能基于React、Vue.js或Angular等现代JavaScript框架构建,这些框架能够实现高效的组件化开发,提供良好的用户体验,并且与后端通过RESTful API进行交互。 3. **数据库设计**:MySQL或...

    网络新闻发布系统 论文+源代码

    在当今信息爆炸的时代,一个稳定且功能强大的新闻发布系统对于媒体机构、企业宣传乃至个人博客来说都至关重要。 这篇论文与源代码的结合,为我们提供了一个深入理解此类系统设计与实现的机会。论文部分可能涵盖了...

    springboot381银行客户管理系统代码--论文pf.zip

    4. **安全控制**: Spring Security是SpringBoot的一个强大组件,用于实现身份验证和授权。在这个系统中,可能使用了Spring Security来保护API,防止未授权的访问。 5. **事务管理**: 由于银行业务对数据一致性的...

Global site tag (gtag.js) - Google Analytics