进行多个 api 调用时如何选择最新的 api 调用

Question

当重复进行多个 API 调用时，我们遇到了一个问题，UI 有时会呈现错误的数据。

示例：

onPageLoad 事件我有 5 个 API 调用，我们有日期选择器，我们可以从中选择日期。当用户尝试更改日期选择器时，将进行所有 5 个 API 调用以刷新数据，假设最初我选择了最后一天并加载了页面，现在我更改为上周然后一个月，然后又回到最后一天，现在有 15 个异步进行了 API 调用，并且在 UI 中，我们渲染了最近到达的任何 API 调用（因为 JS 中的异步行为）。是否有任何角度机制来控制这种行为。

预期：

在上面的示例中，我只想在 UI 中显示最新的 API 调用数据（无论何时解决承诺）我只想显示最后一天的数据。

Answer 1

使用此代码之前的任何 api 调用都将被拒绝。这意味着只有最后一次调用才能解决。

var timeout;

function callApi() {
    // Cancel any previous api call:
    timeout && timeout.resolve();

    // Create a new timeout:
    timeout = $q.defer();

    // Make the api call, passing in the timeout:
    return $http.get('/api', {timeout: timeout.promise});
}