2015-03-02 31 views
0

的Index.html角UI嵌套状态模板不加载

<!doctype html> 
<html ng-app="testApp"> 
<head> 
    <meta name="viewport" content="width=device-width"> 
    <link rel="Shortcut Icon" type="image/ico" href="img/favicon.png"> 
    <link rel="stylesheet" href="styles/vendor.css"> 
    <link rel="stylesheet" href="styles/app.css"> 
</head> 
<body id="wrap"> 
<div ui-view></div> 
<script src="js/vendor.js"></script> 
<script src="js/app.js"></script> 
</body> 
</html> 

app.js

"use strict"; 
var TestApp = angular.module("testApp",["ui.router"]) 
    .config(["$urlRouterProvider","$stateProvider",function(a,b) { 
    a.otherwise("test", { 
     url: "/test", 
     title: "Test", 
     template:"<p>Test</p>" 
    }) 
}]); 

这里是我的目录结构 testApp JS - > app.js 的index.html

请更正我的代码

回答

0

UI路由器是关于状态。所以我们必须调用$stateProvider.state()来定义状态。该$urlRouterProvider方法.otherwise()应为默认的导航服务器 - 如果url不匹配注册状态:

.config(["$urlRouterProvider","$stateProvider" 
,function($urlRouterProvider,$stateProvider) { 

    // instead of this 
    a.otherwise("test", { 
    // we need to call .state 
    $stateProvider.state("test", { 
    url: "/test", 
    title: "Test", 
    template:"<p>Test</p>" 
    }) 

    // and also some defaults 
    // but not state name 'test', it should be url '/test' 
    $urlRouterProvider.otherwise("/test") 
+0

宾果和OP Plunker对于同样是在这里http://plnkr.co/edit/YnyG0vrZEd8bDI5pbJwS?p=preview – squiroid 2015-03-02 12:36:08