angularjs 开发思路总结
最近学习并使用了angularjs这一强大的开源框架。在项目开发过程中也慢慢接受并熟悉了用angularjs开发前端。
angularjs是由谷歌的前端大牛开发的一个js框架,刚开始学习时有些难入门,随着对其机制的了解和使用会越来越觉得这个框架十分好用,可以把我们从如何去组织前台页面js代码的繁琐工作中解放出来,而全心的投入到业务逻辑当中。这一点在js代码多且复杂的大项目中效果尤为显著。
通过这次项目实践,对angularjs的开发思路做以下总结:
1.mvc框架,这是web开发中最常见的一种开发思路,将视图,控制器,模型分离。
2.控制器,页面的大部分逻辑结构,展示写在控制器里。
比如从后台接口取得的数据,通过双向数据绑定绑定在$scope上。
3.指令,将公用的小功能写成指令,可以多处调用。
比如导航菜单这样的小模块就可以写成一个指令,每个页面就不用再重复这段代码,只需引入该指令即可。或者对dom的操作也可以写在指令里面。
4.过滤器,是一个十分好用的功能,我们往往会遇到这样的情况,从后台取到的数据不能原样呈现在页面上,而是要进行一定的转换。
例如后台获取到的时间往往会是一个时间戳,那么要转换成日期格式就可以使用angular自带的date过滤器,当然对于遇到的情况不同也可以自己自定义过滤器,将数据按照自己想要的形式展示
5.服务,控制器虽然可以写许多逻辑,但难免会有一些代码冗余的部分,对于每个控制器里重复的代码可以抽离出来公用。这看起来似乎和指令有些相似,但实际上是不一样的,指令可以对页面展示的html代码的公共部分进行抽离,服务是对控制器里的逻辑进行抽离。
例如调用接口这样的代码就可以写在服务里,就不用再每个控制器里重复去写调用相同接口的代码,而是通过一个函数就可以实现
6.路由机制,路由机制对于页面的切换十分方便,体验效果也很好,完全可以取代过去的iframe,它只会替换页面中的一部分而不用完全去刷新或请求整个页面。
7.模块化,依赖注入,模块化在如今的前端开发中已经不算是新概念了,模块化可以将页面不同功能模块分离开来,降低耦合度,便于维护和开发。而依赖注入就是这一模块的开发如果有用到另一个模块中的功能,则直接注入即可,不用重复开发,而且代码耦合度低。
例如一个网站项目想要统一的自定义的提示框效果,那么就可以自己写一个模块完成提示框效果,那么在其他的功能模块要使用这个通用的提示框只需注入即可。如果要修改提示框只需在提示框模块修改,而且不会影响到引用的模块的代码。