我需要有关ember上{{link-to}}的一些信息。我做了一些测试,有一些我真的不明白..
示例:
我的博客上有不同的帖子:
App.Router.map(function() {
this.resource('login', { path: '/' });
this.resource('home');
this.resource('posts', function(){
this.resource('post', { path: '/:post_id' }, function(){
this.route('update');
});
this.route('create');
});
});
假设我有这个模板:
<script type="text/x-handlebars" data-template-name="enquiries">
<table>
<thead>
<tr>
<th>id</th>
<th>type</th>
<th>name</th>
<th>last update</th>
<th>Detail</th>
</tr>
</thead>
<tbody>
{{#each post in model}}
<tr>
<td>{{post.id}}</td>
<td>{{post.type}}</td>
<td>{{post.name}}</td>
<td>{{post.updatedAt}}</td>
<td>{{#link-to 'post' post}}View{{/link-to}}</td>
</tr>
{{/each}}
</tbody>
</table>
</script>
我简单的帖子模板
<script type="text/x-handlebars" data-template-name="post">
<div class="post-info">
<button {{action "update"}}>Update</button>
<table>
<tr>
<td>{{title}}</td>
</tr>
<tr>
<td>{{content}}</td>
</tr>
<tr>
<td>{{author}}</td>
</tr>
</table>
</div>
</script>
那些链接动态的,并且所有这些都有好的URL,例如localhost / posts / 1或2等......
当我点击链接时,没有任何动静。我必须{{oulet}}来展示它。但我的问题是它与我的桌子(下面)在同一页面上显示,但我只想显示帖子模板..
我很难理解为什么,以及在我的情况下出口的主要目的是什么......
感谢。
答案 0 :(得分:2)
post
模板中显示posts
的原因是因为您的Router
以这种方式定义了它。如果你想要一个单独的页面,试试这个:
App.Router.map(function() {
this.resource('login', { path: '/' });
this.resource('home');
this.resource('posts');
this.resource('post', { path: 'posts/:post_id' }, function(){
this.route('update');
});
this.route('create');
});
当你有一个嵌套资源时,{{outlet}}
帮助器指定嵌套模板的呈现位置。