Ember.js新的路由器导航错误消息:错误:断言失败:无法在未定义的对象上使用'id'调用get

Question

我一直在尝试新的路由器和新的Ember代码(版本:v1.0.0-pre.2-366-g4772b18),我有点麻烦.我想做一件简单的事情:当我点击一个链接时,它应该导航到那个状态.

但相反,我得到这个错误:

断言失败:无法在未定义的对象上使用'id'调用get.

要触发错误,请单击红色大标题.第一个位于顶部 - 即"Ember Ready".

我没有JSFiddle,但您可以在这里查看实时网站:http://eduardmoldovan.com/ 我基本上已经在那里推了相同的代码.

我的代码:

var Ngin = window.Ngin = Ember.Application.create({
    ready: function() {
        "use strict";
        this.set("Router.enableLogging", true);
        this.set("Router.location", "history");
    },
    customEvents: {
        blur: "blur",
        paste: "paste",
        changed: "changed"
    }
});

DS.RESTAdapter.configure("plurals", {
    article: "article"
});

Ngin.Store = DS.Store.extend({
    revision: 11,
    adapter: DS.RESTAdapter.create({
        namespace: "private-api",
        bulkCommit: true
    })
});

Ngin.Article = DS.Model.extend({
    title: DS.attr("string"),
    lead: DS.attr("string"),
    url: DS.attr("string"),
    pubdate: DS.attr("date"),
    channel: DS.attr("string")
});

Ngin.IndexController = Ember.ObjectController.extend({
    content: [],
    goToArticle: function() {
        "use strict";
        this.get('target').transitionTo("article");
    }
});
Ngin.IndexModel = DS.Model.extend({});

Ngin.ApplicationView = Ember.View.extend({
    templateName: "page"
});

Ngin.Router.map(function(match) {
    "use strict";
    match("/").to("index");
    match("/technical/:url/").to("article");
});

Ngin.IndexRoute = Ember.Route.extend({
    setupController: function(controller) {
        "use strict";
        var all,
            latestOne,
            latestList;
        latestOne = Ngin.Article.find({
            filter: 'latest-one'
        });
        latestList = Ngin.Article.find({
            filter: 'latest-list'
        });
        controller.set('latestOne', latestOne);
        controller.set('latestList', latestList);
    },
    renderTemplate: function() {
        "use strict";
        this.render("header", {
            outlet: "header"
        });
        this.render("index", {
            outlet: "content"
        });
        this.render("footer", {
            outlet: "footer"
        });
    }
});


Ngin.ArticleRoute = Ember.Route.extend({
    model: function(params) {
        "use strict";
        console.log('ede');
        return Ngin.Article.find(params.url);
    },
    setupController: function(controller) {
        "use strict";
    },
    renderTemplate: function() {
        "use strict";
    }
});

$("body div").remove();

Ngin.initialize();

这是一个简单的动作: {{action goToArticle}}

我真的不明白谁想叫什么.有什么想法吗？我一直在寻找答案或例子,但对此并不幸运.

Answer 1

你的问题是你在transitionTo没有提供模型的情况下打电话.

恩伯正试图过渡到这article条路线.为此,它需要生成:url动态段的值.为了得到它,它将您传递的模型作为第二个参数传递transitionTo给路径的serialize方法.

默认serialize方法尝试使用id模型的属性填充动态段.

你的行动是:

{{action goToArticle}}

它应该是:

{{action "goToArticle" article}}

然后,您需要更新您IndexController的参数:

Ngin.IndexController = Ember.ObjectController.extend({
  content: [],
    goToArticle: function(article) {
      this.transitionTo("article", article);
    }
});

所有这些都说,你真的应该在这里使用链接,而不是动作.这会为你处理一切:

{{#linkTo "article" article}}{{article.title}}{{/linkTo}}

您可以在Ember指南中了解链接帮助程序和操作帮助程序.