AngularJS UI路由器嵌套视图无法加载内容

我看了无数如何设置它的例子。在这里许多人就在这里。但在我的情况下没有任何工作。这是一个非常简单的两个视图，其中一个嵌套在第一个视图之下。第二UI视从未加载...AngularJS UI路由器嵌套视图无法加载内容

这里是简单index.html ...

<body ng-app="d6Games"> 
    <div ui-view="home"></div> 
</body>

这里是单纯的孩子看来，这是里面home.html模板...

<div class="d6body bilbo"> 
    <div ui-view="content"></div> 
</div>

这里是简单的状态...

.state('home', { 
    url: '/home', 
    views: { 
     'home': { 
      templateUrl: '/views/home.html' 
     } 
    } 
}) 

.state('home.intro', { 
    url: '/intro', 
    views: { 
     'content': { 
      templateUrl: '/views/game-intro.html' 
     } 
    } 
})

第一个/views/home.html模板加载正常，但预计未加载子节点/views/game-intro.html。它只是html和文本，与home.html位于同一个文件夹中。

我错过了什么？

来源

2015-04-12 Locohost

有a working plunker

我只是改变了模板路径（去除领先“/”），和所有工作（然而，这是需要plunker，不知道你的环境和路径设置）：

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

    .state('home.intro', { 
    url: '/intro', 
    views: { 
     'content': { 
     templateUrl: 'views/game-intro.html' 
     } 
    } 
    }) 
}

检查行动here

来源

2015-04-12 18:12:41

好了，越来越近。我像你一样添加了ui-sref链接到index.html。当你点击它们时，它们确实会起作用。游戏-intro.html按预期加载。但是，为什么不在页面加载时自动加载，而无需点击home.intro链接？ – Locohost

不知道你是什么意思，但我加了这行'$ urlRouterProvider.otherwise（'/ home/intro'）;'你可以检查这个分叉的plunker，它正在工作http://plnkr.co/edit/Vg3fmypcepEgkA8c40ju ？p =预览..介绍开始工作。如果你想要设置一些** child **状态为默认（而不是它的父级），你应该检查这些链接：http://stackoverflow.com/a/29579343/1679310和http：// stackoverflow。 com/q/29491079/1679310 –

是的，工作。这让我在那里。谢谢Radim！ – Locohost

AngularJS UI路由器嵌套视图无法加载内容

回答

相关问题