Angularjs 在控制器之间传递数据

我要学习AngularJS，它来自很多不同的MV*框架。 我喜欢这个框架，但是我在控制器之间传递数据时遇到了麻烦

假设我有一个带有一些输入（input.html）的屏幕和一个控制器，比如说InputCtrl
这个视图上有一个按钮，它会将您带到另一个屏幕，比如说approve（approve.html）和controller ApproveCtrl
此ApproveCtrl需要来自InputCtrl的数据。在更大的应用程序中，这似乎是一个非常常见的场景

在我以前的MV*框架中，这将像（伪代码）一样处理：

• 它的工作原理类似于控制器优先。 首先创建控制器，有机会将其置于正确的状态；然后创建视图

现在，在AngularJS中，我像这样处理：

 var self = this;
 onClick = function(){
          self.$locationService.path('approve');       
 }

• 这与“视图优先”类似。 如果说要导航到哪个视图/路线，则框架将创建控制器

我发现很难控制创建的控制器的状态并将数据传递给它。 我见过并尝试过以下方法，但在我看来都有自己的问题：

将共享服务注入InputCtrl&ApproveCtrl，并将所有要共享的数据放在此服务上

• 这看起来像是一件肮脏的工作；共享服务中的状态变为全局状态，而我只需要它将数据传递给ApproveCtrl
• 这个共享服务的生命周期比我所需要的要长得多——只是为了将数据传递给ApproveCtrl

以$routeParams形式传递数据

• 当传递大量参数时，这会变得相当混乱

使用$scope事件

• 从概念上讲，这不是我使用事件的目的——我只需要将数据传递给ApproveCtrl，而不需要任何事件
• 这相当麻烦；我必须先向家长发送一个事件，然后再将其广播给孩子们

我是不是遗漏了什么？我是否创建了太多的小型控制器？

---

在这里，我是不是太想保留其他框架的习惯了？

如果您的目的只是在两个视图之间共享数据，那么服务可能是最好的选择。如果您对持久性数据存储感兴趣，您可能需要考虑某种类型的后端服务，如REST API。请看一下用于此目的的$http服务

就结构而言，AngularJS比MVC更模块化

经典的MVC描述了3个简单的层，它们以控制器将模型与视图缝合在一起的方式相互交互（模型不应该直接与视图协同工作，反之亦然）

在Angular中，可以有多个完全可选的实体，这些实体可以以多种方式相互交互，例如：

这就是为什么在不同的实体之间有多种通信数据的方式。你可以：

• 使用在控制器之间直接发送消息
• 发送消息
• 发送消息（注意：与上面的链接相同，答案显示了这两种技术）

或

• 使用AJAX后端发送消息
• 使用外部系统（例如）发送消息

---

…还有更多。由于其多样性，开发人员/设计师可以选择他们最喜欢的方式并继续进行下去。我建议您阅读一些常见问题的解决方案。

即使XLII给出了完整的回答，我发现本教程使用的是服务。使用2-ways绑定属性在控制器之间共享数据非常有趣且简单：

我现在还没用

---

否则，还有另一种方法，基于事件：

如果您希望将简单字符串数据从一个页面（page1）传递到另一个页面（page2），一种解决方案是使用传统的url参数。使用类似于“/page2/param1/param2”的参数调用page2路由url。第2页的控制器将接收“路由图”中的参数。您将能够以routeParams.param1和routeParams.param2的形式访问参数。以下代码采用自：

从page1的控制器（js）或其html中的url调用page2路由，参数如下：

"/page2/param1/param2"

第2页路线：

$routeProvider.when('/page2/:param1/:param2', {
    templateUrl: 'pages/page2.html',    
    controller: 'Page2Ctrl'
});

以及控制器：

.controller('Page2Ctrl', ['$scope','$routeParams', function($scope, $routeParams) {
  $scope.param1 = $routeParams.param1;
  $scope.param2 = $routeParams.param2;
  ...
}]);

---

现在，您也可以访问page2 html/模板中的参数（param1和param2）值。

我会根据您的需要选择第三个参数。服务用于在需要共享数据的控制器之间传递数据，而不是状态。此外，解决方案2更为严格，但随着路由参数的增长，路由参数将成为一个麻烦的问题。第三个选项是正确的方法。您是否要接受XLII答案，链接是金矿，如图所示。感谢您的详细回答；我知道在AngularJS有一些选择，我想知道大多数人如何处理我认为的一个共同的场景。这是一个伟大而详细的答案，但我认为使用服务是最好的选择：那张图！我马上把它寄给我的同事们！

.controller('Page2Ctrl', ['$scope','$routeParams', function($scope, $routeParams) {
  $scope.param1 = $routeParams.param1;
  $scope.param2 = $routeParams.param2;
  ...
}]);