如何正确使用嵌套路由修复以下示例？

Question

所以，看来我并没有得到ui-router，毕竟。

这里是破例如： http://plnkr.co/edit/WgDqTzE3TJjrCZ2pxg5T?p=preview

实际的文件结构为：

app/ 
    app.js 
    index.html 
    main/ 
    main.html 
    header/ 
     header.html 
    footer/ 
     footer.html 
    sections/ 
     content1/ 
     content1.html 
     content2/ 
     ... 

index.html具有简单<div ui-view></div>

main.html具有：

<div ui-view="header"></div> 
    <div ui-view></div> 
    <div ui-view="footer"></div> 

header.html，footer.html,content1.html ......有实际内容。

app.js有：

$stateProvider 
    .state("app", { 
    url: "", 
    abstarct: true, 
    templateUrl: "main.html" 
    }) 

    .state("app.main", { 
    url: "", 
    abstarct: true, 
    views: { 
     "header": { 
     templateUrl: "header.html" 
     }, 
     "footer":{ 
     templateUrl: "footer.html" 
     } 
    } 
    }) 

    .state("app.main.content1", { 
    url: "/", 
    templateUrl: "content1.html" 
    }); 

所以，我认为，这表示要“/”会告诉我的页眉，页脚，并自动在无名ui-view插入内容。

它没有。我究竟做错了什么？

Answer 1

为了使快速工作（不是预期）我刚刚添加锚点到页脚，现在是working

<div> 
    im footer 
    <div ui-view=""></div> 
</div> 

为什么？因为我们国家DEF是这样的：

.state("app.main.content1", { 
    url: "/", 
    templateUrl: "content1.html" 
    }); 

这意味着：

做搜索无名鉴于我的父母

页脚视图是国家"app.main.content1"的父母，所以这样我们可以瞄准它。

还有其他选项。

Here is什么是最有可能的意图：，确定指标的状态被改变：

.state("app.main.content1", { 
    url: "/", 
    views: { 
    "@app": { 
     templateUrl: "content1.html" 
    } 
    } 

所以，现在我们针对app状态，其观点锚<div ui-view="">，由绝对命名。请参阅：

• View Names - Relative vs. Absolute Names

在幕后，每个视图被分配遵循的viewname@statename，viewname表示视图中的指令和国家名称中使用的名称的方案绝对名称是州的绝对名称，例如contact.item。您也可以选择以绝对语法编写视图名称。

最后，我们可以达到同样的甚至一个抽象状态和一个孩子，检查here：

$stateProvider 
.state("app", { 
    url: "", 
    abstarct: true, 
    views: { 
    "" : { 
     templateUrl: "main.html", 
    }, 
    "header@app": { 
     templateUrl: "header.html" 
    }, 
    "footer@app":{ 
     templateUrl: "footer.html" 
    } 
    } 
}) 

.state("app.content1", { 
    url: "/", 
    templateUrl: "content1.html", 
}); 

现在，所有UI-Router魔术在根状态DEF发生。我们首先以root（index.html）unnmaed view为目标，注入main.html。下一步 - 行吟诗人的观点目标通过“头@应用”这个国家本身（main.html中的） - 绝对命名

这将是最合适的方式... working example