ember.js - 如何定义在 Ember 中点击父级时进行渲染的嵌套路由

Question

我有一个博客路线和一个博客帖子路线。

路由器:

App.Router.map(function () {
    this.resource('blog', function () {
        this.route('post', {path: ':id/:title'});
    });
});

路线:

App.BlogRoute = Ember.Route.extend({
    model: function () {
        return this.store.find('BlogPost');
    }
});

App.BlogPostRoute = Ember.Route.extend({
    model: function (params) {
        return this.store.findById('BlogPost', params.id);
    },
    serialize: function (model, params) {
        return {
            id: model.get('id'),
            title: Ember.String.dasherize(model.get('title'))
        }
    }
});

在父 blog 路线的 Handlebars 模板中，我有一个 {{outlet}}，当我单击其中一个 {{#link 时，它可以正常工作-到}}s。

我想要做的是，当用户转到 /blog 路由时，默认渲染最新(最高 ID)的博客文章。

我找到了this question并尝试了这个结果，但无济于事:

App.BlogIndexRoute = Ember.Route.extend({
    redirect: function () {
        var latest = 3;
        this.transitionTo('blog.post', {id: latest});
    }
});

(latest 只是 this.model.pop() 或任何需要的占位符。)

我只是不知道如何准确地使用模型中的数据加载子路由。

Answer 1

您可以使用 modelFor 获取已获取的任何资源/路由(也称为父资源)的模型

App.BlogIndexRoute = Ember.Route.extend({
    redirect: function () {
        var blogs = this.modelFor('blog');
        if(blogs.get('length')){
           this.transitionTo('blog.post', blogs.get('firstObject')); // or blogs.findBy('id', 123)
        }
    }
});