Javascript 角度ui引导模式中的嵌套视图

这是我的angularjs应用程序的入口点。我试图创建一个具有多个视图的模式

(function() {
  'use strict';

  angular
    .module('app', ['ui.router', 'ui.bootstrap'])
    .config(function($stateProvider, $urlRouterProvider) {
      $stateProvider
        .state('modal', {
          url: '/modal',
          onEnter: ['$stateParams', '$state', '$modal', function ($stateParams, $state, $modal) {
            $modal.open({
              templateUrl: 'partials/modal.html',
              backdrop: 'static'
            });
          }]
        })
        .state('modal.models', {
          url: '/models',
          templateUrl: 'partials/modal.models.html'
        });
    })
    .run(function ($rootScope) {
      $rootScope.$on("$stateChangeError", console.log.bind(console));
    });
}());

这是主要观点

<!-- Modal -->
<div id="myModal">
  <div class="modal-header">
    <h2>Select your own car</h2>
  </div>
  <div class="modal-body">
    <h4>Brands</h4>
    <a ui-sref="modal.models">Models</a>
    <div ui-view></div>
  </div>
</div>

---

对于那些像我这样后来蹒跚前行的人，这里有另一条路：

使用一个简单的CSS模式（而不是花哨的ui引导模式）来实现相同的最终结果——在模式交互下保留额外的“粘性状态”。请注意，这支持模态中的子状态

$stateProvider.state('modal', {
      url: '/modal',
      views: {
        'modal': {
          templateUrl: 'modal.html'
        }
      }
  });

  $stateProvider.state('modal.substate', { 
    url: '/substate',
    template: '<h3>I\'m a substate in a modal'
  });

$stateProvider.state（'modal'）{
url:“/modal”，
观点：{
“模态”：{
templateUrl:'modal.html'
}
}
});
$stateProvider.state（'modal.substate'，{
url:“/substate”，
模板：“我是模态中的子状态”
});

（示例代码归功于@christopherthielen。）

情态动词
此模态有一个子状态--您的代码遵循的是，注入模板中的ui视图似乎不再对ui路由器可见/可用。唉！好的是，只需滚动您自己的模式窗口就不需要太多
 该主题的可能重复并不能解决我的问题我认为问题在于子状态将再次从父级
oneter
函数中使用
partials/modal.html
打开模态！这就是为什么我认为我能帮助你的原因。有解决这个问题的办法吗？我也看到了同样的问题。
$stateProvider.state('modal', {
      url: '/modal',
      views: {
        'modal': {
          templateUrl: 'modal.html'
        }
      }
  });

  $stateProvider.state('modal.substate', { 
    url: '/substate',
    template: '<h3>I\'m a substate in a modal'
  });

   <script type="text/ng-template" id="modal.html">
      <div class="modal-overlay fade">
        <div class="modal-content">
          <h2>Modal</h2>
          This modal has a substate.  <a ui-sref=".substate">Activate it</a>
          <div ui-view></div>
          <a ui-sref="app">Back to the app...</a>
        </div>
      </div>
    </script>