5

我有一个资源，我在其中列出了服务器 /projects 中的所有项目。您可以访问 /projects/:slug 的特定项目。

当我访问项目资源时，我在 Ember Inspector 中看到了这些数据：

/项目

id  | Slug              | Title                 |
-------------------------------------------------
1   | first-project     | First project         |
-------------------------------------------------
2   | second-project    | Second project        |
-------------------------------------------------
3   | third-project     | Third project         |

当我从项目列表中访问一个项目时，我得到相同的数据而没有新的 ajax 请求，并且一切正常。/项目/第一个项目

当我刷新/projects/first-project页面时，问题就来了。Ember 发出 ajax 请求以从服务器获取数据，但它还插入一个空行，其中 slug 作为 id 作为数据。

id              | Slug              | Title                 |
-------------------------------------------------------------
first-project   |                   |                       |
-------------------------------------------------------------
1               | first-project     | First project         |

现在访问项目列表它显示了一个项目列表，但列表顶部是这个空行。为什么将这个 slug 行插入我的数据？也许我的逻辑是错误的。

<li>
    <a id="ember451" class="ember-view" href="/projects/undefined">
        <script id="metamorph-13-start" type="text/x-placeholder"></script>
        <script id="metamorph-13-end" type="text/x-placeholder"></script>
    </a>
</li>

我的项目代码：

App.Router.map(function() {
    this.resource('project', { path: '/projects' }, function() {
        this.resource('project.show', { path: ":post_slug"});
    });
});

App.Project = DS.Model.extend({
    slug: DS.attr("string"),
    title: DS.attr("string")
});

App.ProjectIndexRoute = Ember.Route.extend({
    model: function() {
        return this.store.find('project').then(function(data) {
            return data;
        }); 
    }
});

App.ProjectShowRoute = Ember.Route.extend({
    model: function(params) {
        return this.store.find('project', params.post_slug).then(function(data) {
            return data;
        }); 
    },
    serialize: function(model) {
        return { post_slug: model.get("slug") };
    }
});

我正在使用：

DEBUG: ------------------------------- 
DEBUG: Ember      : 1.1.2 
DEBUG: Ember Data : 1.0.0-beta.3 
DEBUG: Handlebars : 1.0.0 
DEBUG: jQuery     : 1.9.1 
DEBUG: -------------------------------
4

3 回答 3

2

添加这个有帮助。现在主键是 Project 模型的 slug 并且它不会重复行。

App.ProjectSerializer = DS.RESTSerializer.extend({
    normalize: function(type, hash, property) {
        hash.id = hash.slug;
        return this._super(type, hash, property);
    }
});
于 2013-11-01T20:12:12.417 回答
0

通过调用

store.find('project', 'first-project')

您将蛞蝓视为主键。我想这就是初始化新记录的原因（您有一个带有第一个项目的实际主键的可能是一个数字，而另一个带有“第一个项目”作为主键。尝试通过调用更改模型挂钩商店的 find() 方法带有搜索选项的哈希值，在您的情况下：

store.find('project', { slug: 'first-project' })
于 2013-11-01T14:05:43.317 回答
0

在不扩展 RESTSerializer 的情况下，还有两种其他方法可以解决此问题。

第一种方法：如果您可以确保 slug str 在整个应用程序中是唯一的，并且您并不真正关心 id 编号。然后，您可以使用 slug str 为每个项目设置 id，因为 id 不必是数字。

{ id：'第一个项目'，内容：'xxx' } { id：'第二个项目'，内容：'yyy'}

第二种方法。使用 modelFor 方法。下面的示例代码：

App.ProjectShowRoute = Ember.Route.extend({
    model: function(params) {
        return this.modelFor('its_parent_route').findBy('slug', params.post_slug); 
    },
    serialize: function(model) {
        return { post_slug: model.get("slug") };
    }
});

通过在此处调用 modelFor，它不会重复调用服务器，因为您使用的是 ember 数据。

希望能帮助到你。

于 2014-02-21T06:58:59.130 回答