Question

所以我正在开发一个应用程序，它需要我做一些AJAX调用来加载一些JSON并使用KnockoutJS绑定它。我发现虽然有时候我的AJAX调用每次都不会填充我的select元素，但是AJAX调用会被执行但是我的某些select元素在DOM中没有选择选项。我通过实现回调函数解决了这个问题，但我想知道是否有更优雅的方法来完成这个？我觉得有更好的方法来实现这一目标，但我只是遗漏了一些东西。这就是我现在的viewmodel实现：

   activate = () => {
        this.refreshMonths(() => {
            this.refreshDays(() => {
                this.refreshYears(() => {
                    this.refreshHeightFeet(() => {
                        this.refreshHeightInches();
                    });
                });
            });
        });
        this.isActivated = true;
    }

    refreshMonths(callback: () => any) {
        this._propertyDataValueService.getMonths().done(entities => {
            this.months(entities);
            callback();
        });
    }


    refreshDays(callback: () => any) {
        this._propertyDataValueService.getDays().done(entities => {
            this.days(entities);
            callback();
        });
    }

    refreshYears(callback: () => any) {
        this._propertyDataValueService.getYears().done(entities => {
            this.years(entities);
            callback();
        });
    }

    refreshHeightFeet(callback: () => any) {
        this._propertyDataValueService.getFeet().done(entities => {
            this.feet(entities);
            callback();
        });
    }

    refreshHeightInches() {
        this._propertyDataValueService.getInches().done(entities => {
            this.inches(entities);
        });
    }

以下是我的服务：

export class PropertyDataValuesSerivce {
    private _baseUrl = '/Data/';

    getMonths(): Q.Promise<Array<Models.SelectListModel>> {
        return Q($.getJSON(this._baseUrl + 'GetMonths'));
    }

    getDays(): Q.Promise<Array<Models.SelectListModel>> {
        return Q($.getJSON(this._baseUrl + 'GetDays'));
    }

    getYears(): Q.Promise<Array<Models.SelectListModel>> {
        return Q($.getJSON(this._baseUrl + 'GetYears'));
    }

    getFeet(): Q.Promise<Array<Models.SelectListModel>> {
        return Q($.getJSON(this._baseUrl + 'GetFeet'));
    }

    getInches(): Q.Promise<Array<Models.SelectListModel>> {
        return Q($.getJSON(this._baseUrl + 'GetInches'));
    }
}

Answer 1

您是否必须按特定顺序发出请求，还是可以并行执行？即：

activate = (): Q.Promise<Models.SelectListModel[]> => {
    return q.all([
        this.refreshMonths(),
        this.refreshDays(),
        this.refreshYears(),
        this.refreshHeightFeet(),
        this.refreshHeightInches()
    ]).then(res => {
        this.isActivated = true;
        return res
    })
}

避免AJAX的多次回调的优雅方法在Typescript中获取？

1 个答案: