用于多部分视图的角度控制器结构

布局

我需要使用AngularJS和web api在SPA中创建此布局。 工作流程如下:

  1. 当控制器加载时,从api获取两组数据(上面的表和左边的表 – 例如2次调用api / data1api / data2
  2. 一旦用户单击上表中的行,详细信息就会被提取到右侧的框中( api / data1 / 3434 / detail
  3. 当用户单击详细信息框中的某些条目时,相关条目将在左侧表格中突出显示。

我开始创建一个包含所有内容的视图,也是一个暴露所有必要内容的属性的控制器,但现在它看起来像这样(伪)

myPageController table1Data : Array; table2Data : Array; userSelectedFromTable1 : IData1Model; userSelectedFromTable2 : IData2Model; 

我觉得这不是很好的做法。 有没有办法将零件细分为某种局部视图? 子控制器? 或者这是一种常见的方法吗? 当他要为多种数据/ api端点服务时,通常的控制器会是什么样子?


编辑

我应该澄清,这只是一个更大的应用程序的一个特定页面(部分)。 大多数部件只是一种数据的前端,例如一个控制器,一个模型,一个api调用等。将页面视为某种仪表板,其中显示多个数据并相互交互。

有没有办法将零件细分为某种局部视图? 子控制器?

这些部分应该是指令 。 您将左视图作为指令,右视图是指令,控制器是两个指令实例之间的粘合剂。

所以控制器的概述:

 myPageController tablesData : IData1Model[]; userSelectedTable : IData1Model;