如何在多个视图部分中重用angularjs数据？

Question

我正在使用AngularJS构建某种仪表板Web应用程序：

• 在一个“概述”页面中，有几个不同组件的摘要图表，例如：“前3名人员”和“前3名公司”
• 在另一个“人物”页面中，我想再次显示“前3人”图表，但没有“前3名公司”图表。
• 同样，在“公司”页面中，我只想显示前3家公司“图表

如何在相关页面和概述页面中重用每个图表（模型，视图，功能）？组织控制器，视图等的正确方法是什么？

Answer 1

您可以使用服务并在不同页面上调用该服务。如果您的图表只是html，那么您可以使用值配方

http://learn-angular.org/#!/lessons/the-value-recipe

如果它更复杂，你可以使用

之类的东西

http://learn-angular.org/#!/lessons/the-service-recipe

Answer 2

对于数据层，我认为最好的方法是使用service。

您可以使用服务在不同控制器之间传递数据。您只需使用依赖注入将服务注入适当的控制器。每个服务都有 getters 和 setters 来存储和检索数据。

至于组织，每个视图都应该有自己的控制器。

对于视图图层，最好的选择是custom directives

指令是可重用组件，可在整个应用程序中使用，并且可以在HTML中的任何位置注入。每个可重用指令都可以通过属性将数据传递给它来自定义

Answer 3

• 创建图表视图指令
• 加载或缓存日期的服务（顶级人员或公司） 从这一点两个方向
• 将service注入指令并初始化throw属性，其中put url来自load data
• 在too controller和init指令中注入服务，图表日期抛出指令属性

重复使用指令