Javascript 如何正确设计angularjs表格应用程序？

单页应用程序由选项卡组成，这些选项卡最初或在工作期间创建。 用户应该能够打开和关闭新选项卡，在它们之间来回切换，而不会改变嵌套小部件的状态。 选项卡包含大量视图，包括各种输入和网格中呈现的数据集

如果我理解正确，ng route和ui route将替换所有内容ng view/ui view，它们不能保留复杂的状态，也不能用于实现此类选项卡

我对选项卡的看法是使用tabset/tab指令的引导样式，或者使用ng show/ng hide手动进行引导

1. 如果我这样做：

<div ng-controller="TabsCtrl as ctrl">
<tabset>
  <tab ng-repeat="tab in ctrl.tabs>something</tab> 
</tabset>
</div>

看起来很奇怪，但还有别的办法吗

3. 创建新选项卡时，应该从TabService.openTab方法传递一些参数。或者，如果能够识别自身，它可以从TabService请求参数

如果使用创建选项卡

<tab ng-repeat="tab in ctrl.tabs"><ng-include src="tab.src"></tab>

---

tab.src引用了一些内部带有附加控制器的部分html，这样的控制器如何与外部作用域通信？

ui路由器可以配置控制器和空模板

.config(function($stateProvider, $urlRouterProvider){
  $stateProvider
    .state('main', {
      url: "/foo/index",
      template: 'empty',
      controller: 'MainCtrl'
      })
    .state('foo', {
      url: "/foo/:fooId",
      template: 'empty',
      controller: 'FooCtrl'
      });

每次状态更改和传递状态参数时都会调用此控制器。 然后，它可以访问服务以切换/打开/创建选项卡

需要另一个控制器将服务与视图绑定

和ng仅当对象标识更改时才重复重新渲染

.config(function($stateProvider, $urlRouterProvider){
  $stateProvider
    .state('main', {
      url: "/foo/index",
      template: 'empty',
      controller: 'MainCtrl'
      })
    .state('foo', {
      url: "/foo/:fooId",
      template: 'empty',
      controller: 'FooCtrl'
      });