灰烬异步计算属性返回未定义

Question

我正在尝试将属性设置为模型的async has hasy关系的值。 但是我无法在then函数内返回任何值。

App.Athlete = DS.Model.extend({
    name: DS.attr('string'),
    age: DS.attr('number'),
    splits: DS.hasMany('split', {async: true}),
    times: DS.hasMany('time', {async: true}),
});

App.Time = DS.Model.extend({
    athlete: DS.belongsTo('athlete', {async:true}),
    race: DS.belongsTo('race', {async: true}),
    time: DS.attr('string'),
});

App.Split = DS.Model.extend({
    distance: DS.attr('string'),
    time: DS.attr('string'),
    athlete: DS.belongsTo('athlete', {async:true}),
    race: DS.belongsTo('race', {async: true}),
});

我的问题在于一个Athlete的ObjectController，我试图将Time hasMany数组设置为属性。 在then回调函数之外，我可以正常返回值。 但是，在then回调中，所有值都返回undefined /根本不返回。 另外，使用console.log我始终可以看到代码正在执行。

这是该方法：

time: function() {
    var raceid= '1';
    this.get('times').then(function(times) {  // returns undefined in this scope
        console.log(times.get('length'));     // consistently displays
        times.forEach(function(time) {
            time.get('race').then(function(timerace) {
                if(timerace.get('id')===raceid) {
                    console.log('match');     // consistently diplays
                    console.log(time.get('time')); // consistently displays
                    return time.get('time'); // returns undefined/not at all
                }
            });
        });
    });
}.property('time.@each.time'),

尽管上面的函数总是返回undefined ，但是下面的函数（同一控制器的一部分）始终如一地正常工作，不会出错。

sortedSplits: function(){
    var self = this,
    raceid = '1',
    splits = this.get('splits');
    // filter each split by race
    this.get('splits').filter(function(split) {
        // retrieve race split belongsTo
        split.get('race').then(function(race) {
            // compare race
            return race.get('id') === thisrace; 
        });
    });
    splits = splits.sortBy('m');
    return splits;                // returns correctly
}.property('splits.@each.m'),

在查看了6个小时后，我不再知道该在哪里查找问题。 我不知道这个问题是从哪里来的。 会有其他人碰巧知道该问题可能源于何处？

注意：我的问题与基于异步数据的Ember中的Compute属性类似，尽管我对该解决方案没有任何运气。

Answer 1

您没有向计算属性返回任何内容，而是向回调函数返回了一些内容，该回调函数已移交给任何链接的promise，但是如果您返回了promise，那仍然无济于事，因为将promise返回给compute属性不会不会自动解决承诺，并以计算出的属性值使用结果。

您当前的计算属性实际上是在这样做：

time: function() {
    var raceid= '1';
    this.get('times').then(function(times) {  // returns undefined in this scope
        console.log(times.get('length'));     // consistently displays
        times.forEach(function(time) {
            time.get('race').then(function(timerace) {
                if(timerace.get('id')===raceid) {
                    console.log('match');     // consistently diplays
                    console.log(time.get('time')); // consistently displays
                    return time.get('time'); // returns undefined/not at all
                }
            });
        });
    });
  // I'm not returning anything so
  return undefined;
}.property('time.@each.time'),

在这种情况下，最简单的方法是使用观察者并设置属性（尽管看起来您不小心在看时间，而不是看时间）

time: null,
timWatcher: function() {
    var raceid= '1',
        self = this;
    this.get('times').then(function(times) {  // returns undefined in this scope
        console.log(times.get('length'));     // consistently displays
        times.forEach(function(time) {
            time.get('race').then(function(timerace) {
                if(timerace.get('id')===raceid) {
                    console.log('match');     // consistently diplays
                    console.log(time.get('time')); // consistently displays
                    self.set('time', time.get('time')); // set property to time value
                }
            });
        });
    });
}.observes('times.@each.time'), //times, not time