javascript - 在 Typescript 中避免 AJAX Gets 多次回调的优雅方法？

Question

所以我正在开发一个应用程序，它需要我进行一些 AJAX 调用来加载一些 JSON 并使用 KnockoutJS 绑定(bind)它。我发现，虽然有时我的 AJAX 调用不会每次都填充我的选择元素，但 AJAX 调用会执行，但 DOM 中不会有一些选择元素的选择选项。我通过实现回调函数解决了这个问题，但我想知道是否有更优雅的方法来完成这个任务？我觉得有更好的方法来实现这一目标，但我只是错过了一些东西。这就是我当前的 View 模型实现的样子:

   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
    })
}