如何在不使用 $scope 的情况下更新 AngularJS 中的 DOM (1.7.x) in Promise.all()？

Question

我们一直在尝试尽可能多地准备工作中的应用程序，以便将来从 AngularJS 迁移到 Angular。我的理解是我们要尽可能避免使用 $scope 。但是，我发现我正在执行 Promise.all() 并且我不知道如何在没有 $scope.$apply() 的情况下更新 DOM。这里有一些伪代码作为例子。

Angular 1.7.x 问题：如何让 DOM 在 Promise.all() 解析时呈现新值？街上的消息是我们不应该使用 $scope.$apply()，但这就是我能弄清楚的...

export class FooController {

    constructor(FooService, $scope) {
        this.fooService = FooService;
        this.$scope = $scope;
    }

    $onInit() {
        this.data = [];
        this.requests[...]; // holding some requests
        this.updateData();
    }

    updateData() {
        let promises = [];
        this.requests.forEach(i => promises.push(this.fooService.get(i)));

        Promise.all(promises)
            .then(res => {
                this.data = res;
                this.$scope.$apply();
            })
    }
}

FooController.$inject = ['FooService', '$scope'];

export const fooComponent = {
    templateUrl: templateUrl,
    controller: FooController
}

Answer 1

要在 DOM 中使用一个值，该值应该附加到范围或控制器。因此，如果不更改 $scope 或控制器的属性

的值，则不能更改 DOM 中的任何值

Answer 2

使用$q service:

export class FooController {

    constructor(FooService, $q) {
        this.fooService = FooService;
        this.$q = $q;
    }

    $onInit() {
        this.data = [...];

        this.updateData();
    }

    updateData() {
        let promises = [];
        this.data.forEach(i => promises.push(this.fooService.get(i)));

        ̶P̶r̶o̶m̶i̶s̶e̶.̶a̶l̶l̶(̶p̶r̶o̶m̶i̶s̶e̶s̶)̶
        this.$q.all(promises)
            .then(res => {
                this.something = res;
                ̶t̶h̶i̶s̶.̶$̶s̶c̶o̶p̶e̶.̶$̶a̶p̶p̶l̶y̶(̶)̶;̶
            })
    }
}

FooController.$inject = ['FooService', '$q'];

export const fooComponent = {
    templateUrl: templateUrl,
    controller: FooController
}

AngularJS 通过提供自己的事件处理循环来修改正常的 JavaScript 流程。这将 JavaScript 分为经典和 AngularJS 执行上下文。只有在 AngularJS 执行上下文中应用的操作才能受益于 AngularJS 数据绑定、异常处理、属性监视等

ES6 承诺未与 AngularJS 执行上下文集成。而是使用 $q Service.

创建的承诺

如何在不使用 $scope 的情况下更新 AngularJS 中的 DOM (1.7.x) in Promise.all()？

How Do I Update The DOM in AngularJS (1.7.x) in Promise.all() Without $scope?

angularjs

promise

angularjs-scope

angular-promise