ember.js - 在模板中遍历对象

Question

我的一个数据模型具有以下数据结构：

properties : {
    ....
    locator_map : {
        locator1 : locator_doc_id1,
        locator2 : locator_doc_id2,
        ...
        locatorN : locator_doc_idN,
    },
    ...
}

在我的模板中，我想提供指向这些文档的链接，但我不知道如何遍历对象locator_map。我想在这些方面做点什么：

{{#each locator in this.properties.locator_map}}
    {{#linkTo "locators.show" this.properties.locator_map[locator]}}locator{{/linkTo}}
{{/each}}

但是我有两个问题：

1. “断言失败：#each 循环的值必须是一个数组。您传递了 [object Object]”
2. 如何访问值？我的印象this.properties.locator_map[locator]是行不通。

知道如何行走物体吗？

Answer 1

这不起作用的原因是因为 ember 框架中的几乎所有东西都从扩展而来，Ember.Object但你locator的却没有，所以你有两个选择：

1. 创建一个自定义车把{{#each}}助手来处理您的Ember.Object非
2. 解析从后端返回的数据并将locator_map对象转换为Ember.Object's 这将使对象然后也具有绑定意识等。

另请参阅我最近回答的这个答案，它涉及类似的案例。

希望能帮助到你。

Answer 2

正如@intuitivepixel 所建议的，这是我的变换：

// Used to represent a generic key:value mapping
DS.RESTAdapter.registerTransform('dict', {
    serialize: function(data) {
        var dict = {}, element;
        for (var i = 0; i < data.length; i++) {
            element = data[i];
            dict[element.get('key')] = element.get('value');
        }
        return dict;
    },
    deserialize: function(dict) {
        var data = Ember.A(), element;
        for (var key in dict) {
            data.push(Ember.create({ key: key, value: dict[key] }));
        }
        return data;
    }
});

该模型：

SettingsApp.ServiceProperties = SettingsApp.CommonProperties.extend({
    locator_map : DS.attr('dict'),

});

SettingsApp.Service = DS.Model.extend(SettingsApp.NodeMixin, {
    properties : DS.belongsTo('SettingsApp.ServiceProperties')
});

以及在模板上的使用：

{{#each locator in this.properties.locator_map}}
    {{#linkTo "locators.show" locator.value}}{{locator.key}}{{/linkTo}}
{{/each}}