Question

考虑您有一些组成部分，例如将GET请求发送到服务器的自动完成功能：

...
someObject = create();
vm.search = someFactory.getHttp(params).then(result => {
  someObjet.prop = result;
});

vm.$onDestroy = () => {
  someObject = null;
}

如果在请求挂起时销毁了组件，则回调将引发js错误。我知道在这个具体示例中，我可以使用简单的If来解决此问题，但是显然可以取消此请求：

var canceler = $q.defer();
vm.search = someFactory.getHttp(params, canceler)...

vm.$onDestroy = () => {
      canceler.resolve();
      someObject = null;
}

这很好用，但是在每个组件中都有这样的代码似乎很奇怪。我想要类似的东西：

vm.search = someFactory.getHttp(params, $scope.destroyPromise)

但是这种东西似乎不存在...

问题：是否有任何简单的方法可以取消销毁组件的请求？无论是在Angularjs还是在Angular

Answer 1

我在Angular中所做的一件事是使用RXjs进行请求，使用订阅，并将这些订阅添加到我们迭代并在销毁时取消的数组中，如下所示：

import { Component, OnInit, OnDestroy} from "@angular/core";
import { ActivatedRoute }              from "@angular/router";

export class AppComponent implements OnInit, OnDestroy {
    private subscriptions = [];

    constructor(private route AppRoute) {}

    ngOnInit() {
        this.subscriptions.push(this.route.data.subscribe());
    }

    ngOnDestroy() {
        for (let subscription of this.subscriptions) {
            subscription.unsubscribe();
        }
    }
}

Answer 2

为什么不将创建的对象分配给不会被破坏的对象？这样可以保持您的行为，并且您可以进行简单的检查以防止出现任何错误。

...
var baseObj = {};
baseObj.someObject = create();
vm.search = someFactory.getHttp(params).then(result => {
    if (baseObj.someObject != null) {
        baseObj.someObjet.prop = result;
    }
});

vm.$onDestroy = () => {
  baseObj.someObject = null;
}

取消销毁组件的本地请求

2 个答案: