我有一个关于多个小部件的数据检索的架构问题。
我正在使用AngularJS构建一个大型JavaScript应用程序（mini-SPA）。我想创建一个带有交互式小部件的非常模块化的仪表板应用程序，用户可以选择在布局系统的容器中包含，排除或重新定位。用户可以与每个小部件进行交互，从而单独刷新其数据等。每个小部件将显示与其他小部件非常不同的数据。
到目前为止，在架构上，每个小部件都将由这些AngularJS组件表示：
因此，每个小部件都能够通过调用特定端点的Angular服务提取自己的数据。
现在，当用户到达包含可能包含5个小部件的仪表板页面时，我不想对5个不同的服务器端点进行5次单独的并行AJAX调用。这不会有效;我想减少对服务器的并行请求。
相反，在到达页面时，我宁愿通过调用聚合了5个小部件的所有数据的端点来进行单个AJAX调用。
问题：假设服务器可以在一个聪明的包装器中捆绑/合并来自1个JSON有效负载中的5个小部件的所有数据，那么在AngularJS应用程序中，我将如何检索和分发该数据5个小部件控制器，以便他们可以使用新的服务器数据初始化自己？
当然，我希望保留任何单个小部件只能自己刷新的能力。虽然到达仪表板页面之外的行为不是我在这个问题中要求的。
也许那里有文章谈论这个，但我还没有找到。
我已经想到了一个我觉得“好”的建筑理念，但我想知道是否有更好的解决方案。
可能性）除了用于进行AJAX调用的5个Angular Services之外，还引入了一个名为WidgetAggregateService的第6个。当执行retrieveAllAndBroadcast()方法时，此服务将处理成功回调本身，然后使用$rootScope.$emit()将有效负载发布到5个控制器。因此，WidgetAggregateService将使用$ rootScope上的Mediator Pattern（或PubSub Pattern），5个控制器可以使用$rootScope.$on()订阅。每个小部件的控制器都可以获取聚合数据有效负载中的相关信息。
答案 0 :(得分：0)
我的团队和我想出了一个解决方案......
API合约
我们开发了一个API合约，允许我们向服务器发出一个或多个小部件的请求（包括传递相关的请求参数），这些小部件将在JSON包装器中返回一个或多个小部件响应。因此，我们可以通过以下方式进行检索：
一次调用服务器。
1）聚合检索：我们有一个AngualrJS“页面”控制器，负责在页面加载时对页面上的所有小部件进行聚合检索。它通过将AJAX请求委托给Ng工厂处理数据检索来请求页面上的所有5个小部件 - 我们称之为“PageResourceFactory”。
2）转发到单个窗口小部件ResourceFactories ：成功获取数据“PageResourceFactory”后，它会调用另一个工厂助手将相关响应转发给调用其set方法的各个窗口小部件资源工厂。因此，此时，所有5个小部件资源工厂都拥有其数据集。
3）窗口小部件控制器订阅新数据：在页面初始化期间，每个窗口小部件控制器已经设置了对自己的资源工厂的订阅，以基本上监听何时设置新数据（通过其资源工厂）设定方法）。那么，控制器可以知道数据何时发生了变化（小部件控制器是否启动了检索）。
4）窗口小部件控制器绑定数据：每个窗口小部件控制器都会“通知”数据更改，因此可以通过将其放在要绑定到视图的范围上进行相应的响应。
这只是标准的AJAX检索 1）控制器通过资源工厂发出请求。
2）资源工厂在$ http的帮助下执行AJAX请求，并将promise对象传递回控制器。
3）控制器获取数据（在成功的promise调用之后）并绑定它以显示视图。
这是我们解决问题的方式。我确信还有其他可能性。