4

我一直在尝试新的路由器和新的 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}}

我真的不明白谁想叫什么。对此有任何想法吗?我一直在寻找答案或例子,但没有幸运。

4

1 回答 1

10

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

Ember 正在尝试过渡到该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 指南中了解链接助手操作助手。

于 2013-01-14T23:59:25.960 回答