Javascript 处于ui路由器状态的多个视图不工作。。未报告任何错误

嗨，我在一个状态下处理多个嵌套视图，就像这个plunkr一样[但它不工作，我也没有任何错误..完全卡住了，非常感谢任何帮助。下面是我的配置块

.config(function($stateProvider,$urlRouterProvider){
  $stateProvider.
  state('home',{
    url: '/',
    views: {
      'funeralhomes': {
        templateUrl: './funeralhome.tpl.html',
        controller: 'FuneralCtrl',
        resolve: {
          funeralhomes : ['FuneralHomes',function(FuneralHomes){
            return FuneralHomes.list;
          }]
        }
      },
      'caskets':{
        templateUrl: './casket.tpl.html',
        controller: 'CasketCtrl',
        resolve:{
          caskets: ['Caskets',function(Caskets){
            return Caskets.list;
          }]
        }
      },
      'foods':{
        templateUrl: './food.tpl.html',
        controller: 'FoodCtrl',
        resolve: {
          foods: ['Foods',function(Food){
            return Food.list;
          }]
        }
      },
      'officiants':{
        templateUrl: './officiant.tpl.html',
        controller: 'OfficiantCtrl',
        resolve: {
          officiants: ['Officiants',function(Officiants){
            return Officiants.list;
          }]
        }
      },
      'flowers':{
        templateUrl: './flower.tpl.html',
        controller: 'FlowersCtrl',
        resolve: {
          flowers: ['Flowers',function(Flowers){
            return Flowers.list;
          }]
        }
      },
      'donations':{
        templateUrl: './donation.tpl.html',
        controller: 'DonationsCtrl',
        resolve: {
          donations: ["Donations",function(Donations){
            return Donations.list;
          }]
        }
      },
      'monuments':{
        templateUrl: './monument.tpl.html',
        controller: 'MonumentCtrl',
        resolve: {
          monuments: ['Monuments',function(Monuments){
            return Monuments.list;
          }]
        }
      }
    },
    abstract: true,
    controller: 'HomeCtrl'
  })
  .state('home.login',{
    templateUrl: './login.tpl.html',
    controller: 'LoginCtrl'
  });

  $urlRouterProvider.otherwise('home');
})

不完全确定您试图实现什么，但我需要让它运行（只是运行）

我首先用了这句话：

// instead of this - state name
// $urlRouterProvider.otherwise('home');
// we have to use url 
$urlRouterProvider.otherwise('/');

原因？我们必须传递州的url，而不是它的名称

此外，主状态是抽象的，因此我们需要导航到某个非抽象的状态。该状态将是子状态，子状态的URL必须与子状态匹配。否则，正如doc所说，我们可以这样做：

.state('home.login',{
    // new line - the otherwise is in fact also matching this non abstract state
    url : '',
    templateUrl: './login.tpl.html',
    controller: 'LoginCtrl'
  });

见：

为“parent.index”状态指定一个空url。这将使其与父状态url匹配，因为它不向父url追加任何内容

$stateProvider
.state（'parent'，{url:'/home'，摘要：true，模板：'}）
//还包括url“/home”，覆盖其父级的激活
.state（'parent.index'，{url:'}）

---

检查更新的plunker

您的代码片段不工作，因为您在主页上的摘要设置为true状态：

 },
    abstract: true,  // remove this
    controller: 'HomeCtrl'
  })
  .state('home.login',{
    templateUrl: './login.tpl.html',
    controller: 'LoginCtrl'

将abstract设置为true，将使状态不可激活。从文档：

抽象状态可以有子状态，但不能被激活 “抽象”状态只是一种不可能存在的状态 转换为。当其中一个 子体被激活

---

ref:

我不确定您想做什么。您想在主页中包含部分内容，还是希望每个页面都有一个页面（一个页面用于食品，另一个页面用于主食等）？

 },
    abstract: true,  // remove this
    controller: 'HomeCtrl'
  })
  .state('home.login',{
    templateUrl: './login.tpl.html',
    controller: 'LoginCtrl'