ember-router - 部分页面的路由器

Question

视图 <--> URL 匹配对是否实际上意味着路由器必须控制整个页面而不能用于控制页面的子集？我有一种情况，Ember 用于页面的一部分，其中最外层的容器视图被手动添加到 DOM 元素。一种解决方法是将整个页面转换为 Ember，但也许还有其他方法？感谢您的任何指点！

Answer 1

您可以指定outlets插入页面的动态部分。出口呈现当前视图。在该视图中，可以有另一个出口来显示子视图。

看这个例子：

申请模板

<div id="content">
  <nav> .. menu part .. </nav>
  {{outlet}}
</div>

这会呈现应用程序的动态部分。例如，当您浏览到时，/pages您可以在其中显示页面列表。当您转到“/pages/1”时，-template 中有一个{{outlet}}呈现pages-template 的page内容。

页面模板

<ul>
{{#each page in controller}}
  <li>{{#linkTo page}}{{page.name}}{{/linkTo}}</li> 
{{/each}}
</ul>
{{outlet}}

页面模板

<h2>{{name}}</h2>

页面名称标题现在呈现在页面列表下方。
这样您就可以根据需要添加尽可能多的动态内容。