AngularJSMVVM形式

    用户操作 ->
View(负责接收用户的输入操作)->ViewModel(绑定数据以及绑定方法自动执行)->Model(数据更新或持久化)->ViewModel(从得到更新后一发加工数据)->View(双向绑定ViewModel数据)

  Model :
领域对象,提供工作数据以及对数据的逻辑处理,其在实际上支出中,恐怕是源于多少个接口的Dto对象,毕竟数据库结构对象不能够向外揭穿。

    View
:展现数据和经受用户操作,与ViewModel中的数据,双向绑定,触发ViewModel中的事件,纯净的html代码,不掺杂或引用JS代码。

  一 、MVC的View与作业逻辑关系紧凑,直接待上访问Model,View包罗Model,MVVM的View与Model松耦合,数据直接从ViewModel中获取绑定。

 

二、优点

  Controller :不是MVVM中的宗旨成分,但是在AngularJS中用来担负ViewModel即$scope的开始化,调用贰个或多少个Model相关的Serive来获取领域对象,还足以绑定上View中的交互事件,如ng-click事件,事件相应措施中调用Model相关Serive来操作Model。

  View:

    AngularJS 1

  Model :领域对象,与事务逻辑相关的数据的包装载体,不包括别的与界面呈现相关的逻辑,Model不关切本身会被什么体现或操作,超过三分之一Model都以来源于于WebApi接口重返的数额或全局配置对象,AngularJS中的Service正是封装和拍卖那些与Model相关的事情逻辑的特等办法,这么些世界对象足以被Controller或任何Service复用。

    用户操作 ->
View(负责接收用户的输入操作)->Controller(业务逻辑处理)->Model(数据持久化)->View(将结果上报给View)

四、AngularJS与MVVM

  ② 、MVC操作流程

    AngularJS 2

看得出View不能够和Model直接互动,而是经过$scope这些ViewModel来达成与Model交互的。

  可采纳:能够把一部分视图逻辑放在ViewModel中,让两个View复用。

  独立开发:开发人士能够小心于业务逻辑和多少开发(ViewModel),界面设计人士能够小心于View的安顿。

一、概念

  ③ 、MVVM操作流程

  ViewModel :让View和Model进一步分离和平解决耦,负责View和Model的互相和同盟,它肩负给View提供彰显数据,以及供View操作Model的门路,AngularJS中$scope充当了ViewModel角色,$scope能够增加数据和相互行为函数,数据来源于分两种,一种是表现音讯的工作数据,直接从Model中得到,另一种是描述交互的派生数据,如有个别保存按钮在编辑情势下才显得,可以定义3个$scoe.is艾德it来控制保存按钮展现隐藏,起先是false,点编辑按钮后装置为true,View中保留按钮用ng-show=’is艾德it’绑定该数量来展现。

 

  可测试性:清晰的View分层,使得表现层的事情逻辑测试更简短和易于。

  低耦合:View能够独立于Model变化和改动,同3个ViewModel能够给多少个View复用,能够形成View和Model变化互不影响。

五、KnockoutJS与MVVM

  AngularJS 3

  显而易见,Model获取到原始数据,ViewModel进一步
加工,View间接呈现,此外当中的网络操作可以分离到独门的类或服务中,ViewModel的不二法门响应View中事件,调用网络操作Model。

  ViewModel :View和Model的连接器,让Model特别符合于View,ViewModel把Model的多少依照View所需的格式进一步转化,使View能够一直绑定,如把来自三个接口的DTO对象,进一步加工成ViewModel数据,其得以一向双向绑定到View,是的确将页面与数据逻辑分离的形式。UI层也有逻辑,那一个逻辑都位于ViewModel中,所以MVVM是也是富客户端的情势。其它,View中元素的轩然大波绑定到ViewModel中定义的办法。

  通过三个函数来成立表示ViewModel的类,须要绑定的数码和函数将用作该类的积极分子。

  AngularJS 4

  ViewModel:

  MVVM是公认的形式,要点是双向绑定技术和ViewModel,双向绑定更有益于你还要保险页面上都依靠于有些字段的N个区域,而不用手动更新它们;而ViewModel用来粘合View和Model,让它们进一步分离和平消除耦,其根本由以下几局地组成:

三、与MVC比较

  MVVM是一种前端框架格局,框架格局首假设用来管理与组织代码,在纷纷应用中,利用高内聚低耦合的想想,将代码分离协会到分化部分,每部分都有其关心点和天职,各部分间耦合度低,达到“关注点分离”目标,使任何应用更易管理、维护,每种部分能够独自更新、替换以及复用,从而达到总体应用的模块化。

  View :专注于界面包车型地铁显示和渲染,即蕴含一堆表明式Directive(指令)的视图模板。

 

相关文章