Question

我有一个AngularJS应用程序，它调用API并返回一组数据，用户可以按标签过滤这些数据，以便在结果中获得更大的粒度。每次单击标记以过滤数据时，应用程序都会进行新的$http.get()调用，并使用相应的查询参数修改URL，以便用户可以保存固定链接并返回到任何特定数据集。

我尝试使用window.history.pushState()为应用程序提供正确的历史记录处理，并将每个历史记录对象的相关查询参数作为状态数据传递。我使用window.onpopstate来检测单击后退/前进按钮的时间，并使用该按钮使用历史记录中的相关状态数据进行新的$http.get()调用。

出于某种原因，$http.get()函数仅在每个秒 popstate上触发，然后进行两次调用。这几乎就像有一些缓存一样，但我还没能找到罪魁祸首。此行为在两个方向，向后和向前都持续存在，并且始终是每隔一个事件。我已经验证window.history.length仅为每个添加/删除的标记增加1，状态数据正在成功发送，新搜索查询正在正确汇编，并且请求路径正确。它没有开火。发生了什么？

为了说明，行为流程如下所示：

在/default加载页面
- 添加第一个标记：网址为/default&tags=a，$http.get()返回新数据
- 添加第二个标记：网址为/default&tags=a,b，$http.get()返回新数据
- 添加第三个标记：网址为/default&tags=a,b,c，$http.get()返回新数据
- 添加第四个标记：网址为/default&tags=a,b,c,d，$http.get()返回新数据
首回按钮事件
- window.onpopstate点火，网址现在为/default&tags=a,b,c
- 无网络更改
第二个后退按钮事件
- window.onpopstate点火，网址现在为/default&tags=a,b
- $http.get()触发，使用/default&tags=a,b,c
- $http.get()再次触发，向/default&tags=a,b
- /default&tags=a,b的数据集加载
第三回按钮事件
- window.onpopstate点火，网址现在为/default&tags=a
- 无网络更改
第四回按钮事件
- window.onpopstate点火，网址现在为/default
- $http.get()触发，使用/default&tags=a
- $http.get()再次触发，向/default
- /default的数据集加载

相关代码段：

$scope.apiRequest = function(options, callback) {

    // Omitted: a bunch of functions to build query
    // based on user-selected tags.
    // I've verified that this is working correctly.

    $http.get(path)
      .then(function(response) {
        console.log('http request submitted');
        if (callback) {
          callback(response.data.response, response.data.count, response.data.facets);
          console.log('data returned');
        }
      }, function(response) {
          console.log('there has been an error');
     });
}

成功或错误事件都不会触发。我已尝试使用$http.get().then().catch()查看是否有其他内容正在进行，但出于某种原因，我在控制台中一直收到错误消息，指出...catch()不是有效的功能，本身就是令人困惑的。有什么想法吗？

谢谢！

Answer 1

这听起来表明函数没有在$digest循环中循环。在这种情况下，您可以尝试将$scope.$apply();添加为window.onpopstate处理函数中的最后一行，以启动$digest周期来执行函数调用。

这篇文章Notes On AngularJS Scope Life-Cycle帮助我更好地理解了$digest周期以及如何强制$digest周期与$scope.$apply();一起运行请记住您想要使用$scope.$apply()谨慎但在某些情况下你被迫开始循环，特别是在异步回调时。

Angular：$ http.get（）仅在onpopstate触发器上每秒触发一次

1 个答案: