Angular 为啥叫 MV* 框架
Posted
技术标签:
【中文标题】Angular 为啥叫 MV* 框架【英文标题】：Why is Angular called MV* frameworkAngular 为什么叫 MV* 框架 【发布时间】：2017-01-24 05:22:24 【问题描述】：从我读到现在的内容（确切地说是answer），它更倾向于 MVVM 模式。将来自服务的数据视为模型，将 Angular 控制器视为 VM，将包含角度绑定的 html 视为视图。
我们可以说MVC是服务器端的模式，MVVM是客户端的模式吗？
有人可以用示例（在 Angular 的上下文中）解释我们如何 实现 MVC 和 MVVM。
我已经阅读了关于使用 var vm = this; 的概念。在 Angular 控制器中。但这是否意味着我们只需为控制器使用别名就可以将 Angular 应用程序从 MVC 转换为 MVVM。
【问题讨论】：
【参考方案1】：首先我认为，最好先介绍一下MVC和MVVM。
不仅仅是在更多的理论背景下进行描述。我宁愿用一个简单的例子来解释。让我们买个披萨吧。
MVC - 就像你打电话给披萨中心并得到送货时发生的事情。
您致电呼叫中心人员（控制器）并下订单（输入）。 然后呼叫中心人员（控制器）安排一些厨师（模型）制作比萨饼，外卖员（视图）提供比萨饼。 然后送货员（视图）从厨师（模型）那里拿披萨，包装好（输出）并交付给您。MVVM - 更像是，当你去商店向服务员下订单时会发生什么。
您将订单（输入）交给服务员（查看）。 服务员（查看）将您点的菜交给咖啡厅经理（查看模型）。 咖啡厅经理（查看模型）安排了一些厨师（模型）制作披萨。 Cooks(Model) 做好准备并将其传递给 Cafe Manager(View Model)。 然后咖啡厅经理（查看模型）将它放入一个漂亮的盘子中，添加叉子/刀、酱汁分配器等（演示）。 服务员（查看）跟踪咖啡馆经理（查看模型）。准备好后，服务员（视图）将交付给您。回到你的问题时，
我们可以说MVC是服务器端的模式，MVVM是客户端的模式吗？ 一边？
我能说的是一般来说是的。 （可能有一些极端情况）。我希望，您可以使用我上面的解释来更好地处理您的问题。
除此之外，由于您指的是 AngularJS，在架构中，它非常接近 MVVM（我这样说是因为它更像是没有答案）。虽然我们在 AngularJS 中有 Controllers，但实际上它们确实完成了 View-Models 的工作。
---------使用 AngularJS 特定示例更新----------
因为我想将我们的范围保留在 Angular 架构中。我举一个一般的例子。
您已经有了要使用 AngularJS 实现的组件的 HTML 模板。 [查看] 该 HTML 模板绑定到一个控制器，在其中您可能会有类似this.controllerAs = vm 的内容。实际上这个术语vm 指的是View-Model。 [视图模型]
理想情况下，在此控制器内部，我们不应实现业务特定逻辑。如果您希望它们包含在客户端中，您应该有单独的工厂、服务（自定义）等来执行此操作。您可以做的是，您可以将那些（工厂、服务）包含在控制器中，并调用它们所需的函数/方法来执行所需的操作。否则，您可以考虑将业务逻辑放在服务器端并使用内置服务（例如：$http）来调用它们。
所以在控制器内部，我们只有绑定到我们想要的视图逻辑（显示要求）的实现。
正如我在第二点中提到的，您拥有 [自定义工厂、服务] 或 [一组 REST 服务 + $http]，其中包含您的业务逻辑。 [型号]所以在通信流中真正发生的是，
客户端（最终用户/另一个组件）调用/启动 HTML（View）最好使用一些输入。 然后控制器（View-Model）获取输入并知道所需的任务是什么。 然后控制器调用它内部的工厂、服务等（模型），以准备绑定到给定输入的所需业务特定输出。 然后模型处理输入并将所需的输出提供给控制器。 然后控制器进行一些特定于显示的调整。 然后将显示 HTML。【讨论】：
你的例子很清楚，但你能在实际的角度实现的上下文中解释一下吗？那太好了。 不完全。根据您的回答，这是否意味着如果我不使用别名vm（在这种情况下），它就是我实现的 MVC。
@Shreyas 绝对没有。如果您将其声明为“vm”或任何其他您想要的。没关系。 Angular 几乎是一个 MVVM 框架。我就是这么解释的。
好的，为什么它被称为 MV* 以及我如何在 Angular 中实现 MVC
之所以称为 MV* (MVWhatever)，是因为 AngularJS 被不同的人称为 MVC 和 MVVM。你可以看这个视频frontendmasters.com/courses/angularjs-mvc-mvvm-mvwhatever 并得到一个想法。我想你的第二个问题也会得到回答。实际上，根据 Angular 架构，这不是一个非常有效的问题。【参考方案2】：
让我们看看 MVVM 的历史： MVVM 最初由 Microsoft 定义，用于 Windows Presentation Foundation (WPF) 和 Silverlight，由 John Grossman 在 2005 年关于 Avalon（WPF 的代号）的博客文章中正式宣布。它还在 Adobe Flex 社区中流行起来，作为简单使用 MVC 的替代方案。 近年来，MVVM 以 KnockoutJS、Kendo MVVM 和 Knockback.js 等结构框架的形式在 javascript 中实现，得到了社区的整体积极响应。
同时，你是对的，AngularJS 更接近于 MVC（或者更确切地说是它的客户端变体之一），但随着时间的推移，通过许多重构和 API 改进，它现在更接近于 MVVM——$scope object 可以被认为是ViewModel 被我们称为控制器的函数修饰。
MVC、MVP 和 MVVM 共有的软件行为是：
1)数据层/业务逻辑（模型）：这是将业务逻辑应用于应用程序数据的行为
2）表示层/UI（View）：View负责应用程序的视觉呈现。
3) 应用程序逻辑（控制器、表示或视图模型）：此行为包含实现模型和视图之间交互的逻辑。
MVVM
MVVM 在 UI 和应用程序逻辑之间提供了清晰的分离。
客户端库：Knockout.js、Kendo (MVVM)
服务器端库：Silverlight、Windows Phone 应用程序、Adobe Flex 或 Tanuki，这是一个受 MVVM 启发的 Web 框架，通过其设计实现惯用的 Ruby、DRY 和可扩展性，或者另一个示例是 WebCore 3 php 框架，它是一个使用 MVVM 模式的独立于平台的框架。
所以我想说说特定模式仅适用于客户端或服务器端是不正确的，它与我们正在使用的框架或我们将为我们的项目建立的可能环境完全相关，无论是在前面或在后端开发中。
文档：Here
请阅读这篇文章
Interesting Article for AngularJs MV*
【讨论】：
以上是关于Angular 为啥叫 MV* 框架的主要内容，如果未能解决你的问题，请参考以下文章