Angular UIRouter 取消/中止解决

Question

我一直在使用功能强大的 ui-router 和 angular，并广泛使用了解析功能。在我的应用程序中，我有以下状态：

.state('main.client', {
       abstract:   true,
       url:         '/:clientID',
       controller:  'ClientDetailsController',
       templateUrl: 'client_details.html',
       resolve:     {
            client: function ($stateParams, ClientService) {
                        return ClientService.getClient($stateParams.clientID) 
                    },
            invoices: function ($stateParams, client, InvoiceService) {
                        return InvoiceService.getInvoices($stateParams.clientID) 
                    },
 }

解析会产生 http 请求。

现在用户点击多个客户直到他们找到他们感兴趣的客户是非常可行的。在我的测试中，客户和发票的解析被排队，即使它们可能不再与当前相关客户。 我希望能够取消/中止这些无关的 http 请求。我以前使用过以下中止逻辑http://www.bennadel.com/blog/2616-aborting-ajax-requests-using-http-and-angularjs.htm，但是由于 ui-router 等待解析完成，我不知道如何挂钩。 有人在这里取得过成功吗？

Answer 1

如果您说用户可以在不查看客户端信息的情况下决定从一个客户端转到下一个客户端（-> 在“解析”解析之前），那么状态级别的“解析”是加载数据的错误工具你在这个特定的情况下。

我建议将这些异步调用移至 ClientDetailsController 并将结果分配给返回的 promise 的 .then() 中的 $scope。

因此，解析不会阻塞用户流程，结果是用户可以看到数据尚未完全加载的 ClientDetail-Page。只需使用适当的占位符。

这样，用户可以在不同的客户端之间快速切换，并且只有在他停留在一个客户端时才会加载数据。