javascript - EmberJS/Ember-data : hasMany collection incomplete, 尽管所有 ID 都存在

标签 javascript ember.js ember-data has-many

安装版本

ember-cli   2.14.2
ember-data  2.14.10

一点透视:

我有一个名为 menu 的服务在计算属性中执行存储查询。这些商店查询之一的行为相当奇怪。它获取模型名称下的所有记录 product-segment来自功能齐全的 JSON API。该模型与名为 product 的模型具有 n-n 关系。 , 通过 hasMany 引用DS 对象:

模型/产品-segment.js
export default DS.Model.extend({

    products: DS.hasMany('product'),
    // ...
});

模型/product.js
export default DS.Model.extend({

    productSegments: DS.hasMany('product-segment'),
    // ...
})

问题:

现在,当我获取这些 product-segment模型,我将 API 指示为 { include: 'products' } ,并且 API 会按要求执行。响应包括 15 个相关的 product特定型号 product-segment , 哪个是对的。

(我们称它为 product-segment 段 x ,这是我下面所有调试信息的主题)

但是,访问 上的关系集合段 x 在任何情况下,任何时候都只返回 12 个模型,因此缺少 3 个。我目睹了与其他 product-segment 类似的问题模型,所以我不认为这是一个特定模型的问题。

更多视 Angular

我最初以为我正在处理某种竞争条件,并确保我创建了一个计算属性 - test - 找出来,我甩了{{menu.test}}进入我的视野,让计算出来的 Prop 发痒。

这是 services/menu.js 中的最低限度信息

export default Service.extend({

    store: inject(),

    activeProductSegment: null,

    // As a note: this does not trigger an infinite loop
    productSegments: computed('store.product.[]', 'store.product-segment.[]', function() {
        return get(this, 'store').findAll('product-segment', { include: 'products' });
    }),

    test: computed('activeProductSegment', function() {
        let segment = get(this, 'activeProductSegment');

        if (segment) {
            console.log(segment.hasMany('products').ids());
            console.log(get(segment, 'products').mapBy('id'));
        }
    }),
});

楼盘activeProductSegment正在设置为不同的 product-segment通过组件的操作对实例进行建模,如下所示:
export default Component.extend({
    menu: inject(), // menu service is injected here...

    actions: {
        setProductSegment(segment) {
            get(this, 'menu').set('activeProductSegment', segment);
        }
    }
});

该操作本身按预期工作,实际上与我的问题无关。 activeProductSegment永远不会以任何其他方式更新。 View 通过此操作 product-segment模型对象:
{{#each menu.productSegments as |segment|}}
    <li {{action 'setProductSegment' segment}}>{{segment.name}}</li>
{{/each}}

麻烦从这里开始

我设置menu.activeProductSegment段 x 通过单击其关联的<li>元素。

当我现在尝试获取所有相关 product 的型号段 x ,返回的集合中只有 15 个模型中的 12 个。为了确保 JSON 响应真的很好(即类型定义等是正确的),我检查了 product 的数量。在 注册的 ID段 x .我记录了以下行(以下日志的上下文在上面的 Ember.Service 片段中):
console.log(segment.hasMany('products').ids());

这返回了一个包含 15 个正确 ID 的数组,所以 段 x 拥有所有应有的身份。全部 product这些 id 的模型已包含在响应中,所以我认为某种异步数据应该没有问题。尽管如此,以下行还是给了我一个 12 个 id 的数组:
console.log(get(segment, 'products').mapBy('id'));

我尝试将 2 个日志放入 2 秒 setTimeout ,但结果保持不变:

This is the 2 logs

我开始认为这是一个错误,因为我注意到第一次没有伴随模型的 id 是下一个 ID 第一次低于前面的 ID。

更新上述我在响应中尝试了不同的顺序,并注意第二个和第三个 id 的:"7", "6" .猜猜这不是问题:

enter image description here

除非我误解,模型应该是实时的,所以任何关系都应该随着数据的可用而更新。我认为这不太可能与格式错误的数据有关。
hasMany 中缺少模型的原因可能是什么?关系集合,尽管所有必要的 id 都已在 hasMany 正确注册关系对象,此时我们不需要等待任何异步/网络数据的到达?什么可能是该问题的合适解决方案?

最佳答案

我知道它似乎与异步问题无关,但我仍然会尝试将 hasMany 定义为非异步:

products: DS.hasMany('product', {async: true}),

关于javascript - EmberJS/Ember-data : hasMany collection incomplete, 尽管所有 ID 都存在,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45869475/

相关文章:

javascript - 如何使用 JavaScript 打开一个下拉菜单并关闭另一个下拉菜单?

ember.js - Ember : deactivate not called when transitioning from one route to another

iframe - Ember.js 使用 HandleBars 在 iframe 中创建 src 属性

javascript - Ember 2,使用 Ember.run.debounce 调用路由中的函数

javascript - 具有嵌入式 hasMay 关系的 EmberJS RESTSerializer

ajax - 无法在 ember 中使用 pushPayload

javascript - Pinterest 板仅在页面重新加载时有效

php - 为什么它不能只突出显示新数据?

javascript - 为什么 SVG 元素的 SVG 属性有时显示为可访问,有时则不可访问?

javascript - 将 CSS 类添加到 Ember.Select