使用LinkTo显示单个对象

Using LinkTo to show a single object

本文关键字：对象 单个 显示 LinkTo 使用      更新时间：2023-09-26

我没有使用EmberData，因为我对它不太满意。相反，我使用$.getJSON:获取模型

App.Persons = App.Model.extend({
    id : null,
    name : null,
    email : null
});
App.PersonsRoute = Ember.Route.extend({
    model : function() {
        return App.Persons.findAll();
    }
});
App.Persons.reopenClass({
    findAll : function() {
        return $.getJSON("personsjson.php").then(function(response) {
            var s = [];
            $.each(response, function(i, row) {
                return s.pushObject(App.Persons.create(row));
            });
            return s;
        });
    }
});
App.Router.map(function() {
    this.resource('persons', function() {
        this.resource('person', {
            path : '/:person_id'
        });
    });
});

我想当有人点击使用LinkTo Helper的人的名字时显示电子邮件。所以我创建了一个这样的个人路线，

App.PersonRoute = Ember.Route.extend({
    model : function(params) {
        return App.Persons.findBy('id', params.person_id);
    }
});

但在url上，我没有在最后得到id，而是得到了"未定义"。

以下是我正在做的HTML端，

            {{#each person in content }}
            <tr><td>
             {{#link-to 'person' this}} <p>{{person.name}}</p>{{/link-to}}
            </td></tr>
            {{/each}}

可能是什么问题？

如果有人感兴趣，我会在后端做这件事

SELECT id, name, email FROM persons;

问题是this是对App.PersonsController的引用，而不是App.Person模型。因此，为了实现这一点，将person传递给{{#linkTo}}，如：

{{#each person in content }}
    <tr><td>
    {{#link-to 'person' person}} <p>{{person.name}}</p>{{/link-to}}
    </td></tr>
{{/each}}

----更新-----

也可以尝试将模型重命名为App.Person，而不是App.Persons

App.Person = App.Model.extend({
    id : null,
    name : null,
    email : null
});
App.PersonsRoute = Ember.Route.extend({
    model : function() {
        return App.Person.findAll();
    }
});
App.Person.reopenClass({
    findAll : function() {
        return $.getJSON("personsjson.php").then(function(response) {
            var s = [];
            $.each(response, function(i, row) {
                return s.pushObject(App.Person.create(row));
            });
            return s;
        });
    }
});
相关文章：