AngularJS客户端MVC模式？

Question

到目前为止，我主要使用Struts 2，Spring，JQuery技术堆栈来构建Web应用程序。关键是，提到的堆栈使用服务器端MVC模式。 Web浏览器的主要作用仅限于请求/响应周期（+客户端验证）。数据检索，业务逻辑，布线和验证主要是服务器端的职责。

我对 AngularJS 框架提出的问题很少，这些问题的灵感来自我读过的以下引文：

---

来自AngularJS tutorial：

  

对于Angular应用程序，我们鼓励使用模型 - 视图 - 控制器   （MVC）设计模式，以解耦代码并分离关注点。

来自 Wikipedia Model–view–controller ：

  

模型 - 视图 - 控制器（MVC）是一种分离的体系结构   表示来自用户与之交互的信息   它。该模型由应用程序数据和业务规则组成，   并且控制器调解输入，将其转换为命令   模型或视图

---

AngularJS 使用客户端MVC模式。所以我想没有其他选择那么以某种方式也将验证逻辑包含在客户端？

编写健壮的AngularJS应用程序的最佳方法是什么？客户端的MVC和服务器端的某种MC（型号，控制器）？

这是否意味着，MODEL和CONTROLLER是以一种方式重复的（客户端/服务器）？

我知道我的问题有些奇怪，但我认为原因是，我在某种程度上习惯了传统的服务器端MVC模式。我确信有人已经完成了相同的过渡。

Answer 1

完全不是一个奇怪的问题 - 我一直在尝试将Angular出售给很多java开发人员，他们问这个问题。我在学习的时候自己问过（我还在学习，顺便说一下）

如果你按照你所描述的那样采用'常规'java webapp并对它进行Angular-ize，你必须首先使用你的服务器并使其成为一个RESTful API。删除JSP等。这实际上是IMO编写Angular应用程序的难点 - 让REST API正确。我决定进入服务器需要什么逻辑的关键是认为它是一个纯粹的api并忘记它将有一个前端。

这个问题确实对我有所帮助 - 如果有人试图保存给定的资源并且该资源没有有效的数据，那么就没有前端告诉他们 - 他们直接点击API，因此API需要拒绝它。因此，后端负责深度验证。这也适用于您的业务逻辑。假设某人正在使用只是 API，它将变得清晰，您的服务器需要做什么。

服务器还需要以（可能）json格式（我使用Spring MVC + Jackson）来提供数据，因此它负责将模型公开给Angular，并与数据库进行通信。

那么在Angular方面的MVC又是什么呢？

• 模型：来自REST API的数据。如果API出售JSON，那么这些对象将已经是第一类javascript对象。
• 查看：HTML和需要操作DOM的指令
• 控制器 :(以及您从控制器中分解出来的自定义服务..）
  • 查询REST API并将视图所需的内容放在$ scope
  上
  • 为指令提供回调，以响应可能需要回调服务器的事件。
  • 验证：通常通过回调指令。 可能会重叠您已经放入服务器的某些验证，但您不希望用户等待服务器验证所有内容 - 客户端应该知道某些东西
  • 业务逻辑：与验证几乎相同。

但为什么在客户端和服务器中重复逻辑？主要是因为你没有写一个应用程序，你正在编写两个独立的东西：

1. 一个REST API，需要健壮且可以在没有前端的情况下使用
2. 需要立即向用户提供反馈而不必等待服务器的GUI。

所以，简短的回答 - 忘记会有一个用户界面来获得REST API，而Angular的内容会更加清晰。

Answer 2

我认为“商业逻辑”一词在这里有点用词不当。客户端应用程序的“业务”是处理用户界面的业务。它不会像安全规则和专有逻辑或其他敏感知识产权那样。

所以在Angular中，分裂是（通常）：

• 控制器（控制器）：用于操作UI后面的数据（范围）。
• 指令：用于设置DOM以通过范围与控制器通信，和用于操作DOM。
• 模板（视图）：将指令分配给DOM的元素。
• 范围（model或viewmodel）：用于在系统的所有部分之间传输数据。
• 服务：可注入，可重复使用的代码。通常用于处理Ajax，cookie或其他I / O的依赖项。

它几乎是MVVM而不是MVC。

至于您的“业务”逻辑或规则......必须始终在服务器级别保护任何需要安全性的内容。

Answer 3

了解在某些版本的MVC模式中，数据以及操作数据的逻辑都位于＆中，这一点非常重要＃34;模型＆＃34;图层（＆＃34;控制器＆＃34;图层除了绑定之外什么都不做）。但是，在AngularJS中，数据（$ scope）仅存在于＆＃34;模型中。层，而操纵数据的逻辑（$ scope）驻留在＆＃34;控制器＆＃34;层

Answer 4

我喜欢@Roy TrueLove所说的。但是我要说这是使用angularjs的最终方式。当然，如果你想获得角度的最大好处，你必须学会​​以这种方式做你的应用程序。我祈祷有一天能在那里。

与此同时，在你的学习过程中，以及在你完全使用angularjs作为客户端主要做事方式的过渡期间，你可以开始在这里和那里使用它来完成一些小任务，逐渐习惯它并且它的思维方式。

我鼓励逐渐接受它并慢慢地走，但当然，我保证，当然。

Angularjs旨在服务于这种方法，因为它可以在最小的任务上工作，就像它可以做最大的任务一样好。例如，我第一次使用angular只是为了在用户键入id时显示名称。

Answer 5

我同意这里的答案。还有一些评论。当您编写应用程序时，首先需要专注于问题域。并创建一些真实业务的软件模型。例如，如果您的问题域是购物，则您需要建模的一些要求可能包括：

• 信用卡应有效。
• 如果您使用品牌X的信用卡付款，您将获得10％的折扣。
• 商店购物车应至少包含一个项目以执行结帐
• 在允许用户将商品添加到购物车之前，商品必须有库存

这些要求的实施将模拟您的问题域，这是您的业务逻辑。

Angular是一个前端框架和工具包。这是一个 web 前端。如果您在Web前端实现此功能，您将错过从其他前端或界面重用模型的机会，例如移动或桌面应用程序。 因此，理想情况下，您的业务逻辑实现需要与任何用户界面框架分离，并与任何持久性框架分离。然后，您将拥有处理用户界面问题的接口对象，并将与业务逻辑对象进行通信。这可以是Spring MVC控制器，和/或Angular控制器或服务。

您可以查看sample application，遵循此处提到的原则。

Answer 6

我似乎也有这个问题，因为有些组织只是热衷于新技术 - “我想要云......等等，我想要轻量级”，很难证明它是否值得转换到更轻的框架。

我一直使用Spring / JBoss seam / JSF和MVC框架开发web应用程序。大多数情况下，java脚本将驻留在表示层验证中，主要操作类/实体和业务逻辑将驻留在Java代码中。在对Angular进行一些基本的实践之后，我开始了解它们对MVC的意义，因为它们在表示层上抽象了另一个级别，我们可以在前端拥有自己的视图和控制器。要回答您的问题，就像每个人的评论一样，最好的方法是将其放在表示层上。

从安全角度来看，我认为繁重或敏感的业务规则应该驻留在服务器端，因为我们不希望将它暴露给全世界。如果业务逻辑开发得很差，就可以很容易地发现代码的弱点并利用它。

这是我对Angular这样的框架的想法，就像一个小商店/ SOHO处理客户，他们有一些人，真正高效和快速。他们很好地迎合面对业务和交付/接收货物的客户（REST，JSON） 。他们确实有指定的角色和任务，但有些工作人员执行的不仅仅是任务。这家商店也容易受到小偷或劫匪的攻击，因为他们通常不会强调安全性。

对于像Spring / Struts 2这样的服务器端框架，想象一下现代公司（CMM Level 5）具有不同级别的管理并且能够处理更大的业务（批处理作业，Web服务，企业总线）。他们确实处理客户，但不直接处理，经常通过经纪人甚至零售商店。安全方面，公司更加强大，通常是前门上的证券，或者重要信息在安全（加密/登录）中受到保护。

Answer 7

我的方法始终是自下而上的方法。从数据库设计开始，在需要时使用正确构造/相关的表，存储过程，然后将实体框架添加到解决方案中，或者如果EF不是选项，则使用ADO.Net。然后开发业务逻辑和模型以将数据输入和输出数据库。

建立模型后，我们现在可以使用两条路径：开发MVC控制器和/或开发WebAPI控制器。两个控制器都可以访问模型，只需要实例化类和调用方法。

您现在可以选择设置由MVC控制器控制的MVC视图，或完全独立的HTML页面集或SPA（NodeJS上托管的单页面应用程序）。

使用完全独立的HTML页面集，您将需要使用WebAPI控制器，使用Get，Post，Put和Delete方法，并确保来回包含令牌以识别您的客户端，并启用CORS（用于Cross Origin Request）

使用MVC视图，您可以使用控制器属性和/或会话来识别您的客户端，而无需担心CORS，甚至可以根据需要使您的视图强烈输入。不幸的是，如果你有一组UI开发人员，他们将不得不使用相同的MVC解决方案。

在这两种情况下，您都可以使用AngularJS在控制器之间来回传输数据。

恕我直言，AngularJS控制器的概念与C＃MVC或C＃WebAPI控制器不同。 AngularJS控制器包含所有javascript逻辑以及通过＆＃34; ApiFactory＆＃34;对端点的调用，而C＃控制器只是服务器端的端点，它接受并响应UI请求。