Ember.js动态链接

时间:2014-02-14 15:32:46

标签: ember.js

我需要有关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}}来展示它。但我的问题是它与我的桌子(下面)在同一页面上显示,但我只想显示帖子模板..

我很难理解为什么,以及在我的情况下出口的主要目的是什么......

感谢。

1 个答案:

答案 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}}帮助器指定嵌套模板的呈现位置。