如何认识Angularjs

最新推荐文章于 2020-04-25 20:04:56 发布

枭鹏

最新推荐文章于 2020-04-25 20:04:56 发布

阅读量498

点赞数

分类专栏： js的点点滴滴

js的点点滴滴专栏收录该内容

21 篇文章 0 订阅

订阅专栏

AngularJS怎样使得web应用更智能更灵：

使用Angularjs作为客户端开发框架的项目开发。主要利用asp.net web api作为restfull服务提供框架和angularjs结合。Angularjs作为html的扩展，旨在建立一个丰富的动态web应用，通过Directive建立一套html扩展的DSL模型，利用PM模式变形MVVM（在网上很多称MVC模式，本人认为在angular0.8是属于经典MVC模式，但在1.0把scope独立注入过后，更倾向于MVVM模式，这将会后续随笔中写道）简化前端开发和使得前端业务逻辑得以分离，view和表现逻辑的分离，更便于维护，扩展。Angularjs本来就是采用TDD开发的，提供了一套单元测试组件和End 2 End的测试框架。Angularjs的的强大之处在于提供了一套内似WPF，Silverlight的强大数据绑定和格式化，过滤组件，这也是MVVM模式所必备的条件；再加之IOC的注入机制，使得不能业务逻辑的分离，服务代码的更大程度抽象重用。
     在这节随便中将讨论的angularjs开发的一些基本准则，为什么会有这篇随便呢，因为看见一些项目对于angularjs的乱用。
  1：不要一个page一个God似无所不能的controller包含所有页面逻辑。
        Angularjs ng-controller旨在将业务逻辑的区分，更推荐按照业务逻辑的划分controller，做到业务功能的高内聚，controller的单一原则SRP。

2：View中包含尽量少的逻辑。
就像jsp，asp这类服务端模板引擎一样，我们应该把尽量少的逻辑放在view中，因为这样会导致view和逻辑的紧耦合性，view在软件开发中是最易变化的，而表现层逻辑却相对于view是相对稳定的行为。同时也导致的view中的逻辑不能被自动化测试，持续集成所覆盖，这将导致以后修改重构和模块的集成的痛苦。很明显的就是太多的angularjs的ng-switch，ng-when和页面计算表达式等等。
3：注意一些特殊的节点式的angularjs directive，因为在IE7上这是不被认识的，因为IE的严格XML模式。如果你想make ie7 happy，

1：请注意导入json2或者json3的js
2：xmlns:ng命令空间和节点element式directive。 <html xmlns:ng="http://angularjs.org"> <head> 11：如果你的公司应用了敏捷开发则，TDD的开发是必备的，angularjs本也是解决javascript测试驱动开发项目。<!--[if lte IE 8]> <script>
document.createElement('ng-include');

3：IOC注入优先，注有助于良好的设计，逻辑的可重用和单元的可测试性，面向对象的“开闭原则”，修改的单一点

4：在controller和service中绝对不能出现html的DOM和CSS代码。
这会导致逻辑的混杂耦合，对于angularjs自身的绑定对html操作，很多时候你会分不清是view的影响源，导致修复bug，和新增功能，重构的艰难，常常出现很多的诡异行为。最好的实践模式则是把必须的dom，css操作移向angular的Directive，或者view中。在angularjs模式中只有directive和view才能出现dom和css的逻辑操作。

5：controller中公用的逻辑推向service（factory，value，config)，采用IOC的注入，提高代码的重用度，修改的单一点，开闭原则。

6：controller应该只包含业务逻辑，对于数据模型的格式化过滤尽量交给angular框架filter等处理。