Ember异步计算属性返回undefined

时间:2014-10-26 05:06:10

标签: javascript ember.js ember-data indexeddb

我正在尝试将属性设置为模型的async,hasMany关系的值。但我无法在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个小时之后,我不再知道在哪里寻找这个问题了。我不明白这个问题的来源。其他人是否会碰巧知道问题出在哪里?

注意:我的问题类似于Computed property in Ember based on async data的问题,尽管我对此解决方案没有任何好运。

1 个答案:

答案 0 :(得分:3)

你没有向计算属性返回任何内容,你正在向回调函数返回一些东西,这个函数被传递给任何链式承诺,但是如果你返回了承诺,那仍然没有帮助,因为返回对计算属性的承诺不会自动解析承诺并使用计算属性值的结果。

您当前的计算属性基本上是这样做的:

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