Angular JS 服务架构

Question

编辑

短版： 说我有应用程序数据是许多不同的服务。我如何避免需要将所有这些服务注入每个显示应用程序状态的控制器？

编辑

我正在构建我的第一个 Angular 应用程序。基本设计是我有一个主页，显示大约 5 个不同变量的值（每个变量都非常复杂）。在此页面上，应用程序正在从蓝牙收集和分析数据。有时，这 5 个变量和一些蓝牙数据会保存到 REST 后端并保存到设备中。这 5 个变量中的每一个都有页面来更改它们的值。

我已尽力遵循最佳做法。我有非常薄的控制器。我为我的所有数据使用服务。我真的只使用 $scope 来绑定视图和控制器之间的数据。

我现在的问题是，我开始使用全局“状态”服务来跟踪这 5 个变量。我注入任何需要显示状态的控制器，并将 html 绑定到它。每当我想更改任何状态时，我都会调用该状态服务的方法来执行此操作。这运作良好，但现在国家服务变得越来越庞大。

我尝试将功能拆分给其他服务，但遇到了需要从 State 服务读取数据，然后写回 State 服务的其他属性的问题。如果我将其他服务注入到状态中，我也无法将状态注入到其他服务中。

我曾想过如何拥有许多较小的服务，但当我将数据保存到服务器时，我一直在思考。当我这样做时，我需要从应用程序的每个角落收集数据以发送。如果所有这些信息都存储在不同的服务中，我只能再次将它们全部注入一个服务中。

在我写这篇文章时，我很确定我错过了一个在应用程序中使用 $scope 的重要概念。

任何指针将不胜感激，

谢谢，

斯科特

Answer 1

你能不能把事情分成子服务，然后让 State 服务成为这些子服务的聚合器，然后不是将 State 注入到子服务中，而是注入你需要的特定子服务？例如：

var app = angular.module('services', []);

app.service('sub1', function(){

    return {
        // ...
    }
});

app.service('sub2', function(sub1){

    var data = sub1.getData();
    data.prop = 'new_value';
    sub1.setData(data);

    return {
        // ...
    }
});

app.service('State', function(sub1, sub2){

    var data = sub1.getData();
    data.prop = 'new_value';
    sub1.setData(data);

    var data = sub2.getData();
    data.prop = 'new_value';
    sub2.setData(data);

    return {
        // ...
    }
});

Answer 2

看来您需要 Redux 来帮助您管理应用程序状态 https://github.com/wbuchwalter/ng-redux