如何在新的Ember.js路由器API中嵌套视图？

Question

我有一个设置屏幕，它由一个侧栏和一个正文组成。正文可以有一个表单来更新用户的个人资料或密码。

路由看起来是这样的：

App.Router.map(function(match) { 
    (match("/")).to("index"); 
    (match("/user")).to("user", function(match) { 
    (match("/")).to("userIdx"); 
    (match("/settings")).to("userSetup", function(match) { 
     (match("/")).to("userSetupIdx"); 
     (match("/profile")).to("userSetupProfile"); 
     (match("/password")).to("userSetupPassword"); 
    }); 
    }); 
}); 

像这样的包装设置模板：

<script type="text/x-handlebars" data-template-name="userSetup"> 
    <div class='sidebar'> 
    Sidebar 
    </div> 
    <div class='main'> 
    Setup <br/> 
    {{outlet}} 
    </div> 
</script> 

一个完整的例子可以在这里找到： http://jsfiddle.net/stephanos/mgp7F/6/

什么是正确的方法在Ember.js中做到这一点？

编辑

随着sly7_7的帮助下，我设法使上述工作的小提琴：http://jsfiddle.net/ygvsS/9/。我所做的只是重命名从userSetup（模板，视图，路线）到setup。但显然这不是一个解决方案（因为我也有appSetup）。

Answer 1

我觉得我已经做了，你在找什么，根据您的评论例如：http://jsfiddle.net/rt8fv/

路由器代码：

App.Router.map(function(match){ 
    match('/').to('home'); 
    match('/about').to('about'); 
    match('/contributors').to('contributors', function(match){ 
    match('/').to('contributorsIndex'); 
    match('/:contributor_id').to('contributor', function(match){ 
     match('/').to('contributorIndex'); 
     match('/details').to('contributorDetail'); 
     match('/repos').to('contributorRepos'); 
    }); 
    }); 
}); 

也许相关的问题：Best approach to fetch data in every state of app