将$http请求迁移到AngularJS V1.6

我将angularjs包升级到1.6.3，发现弃用的

.success

和

.error

函数已被删除。现在，在使用

.then

和

.catch

之后，只执行

.catch

。我正在努力找出这次请求失败的原因

我最初的工作代码是：

if ($scope.IsDinamicReport) {
            $http({
                method: "POST",
                url: "/api/DynamicReport/Post?pageNumber=" + $scope.PageNum + "&orderbyColumn=" + $scope.orderByColumn + "&sortOrder=" + $scope.sortOrder
                    + "&showNumberPagingStats=" + $scope.showNumberPagingStats,
                contentType: "application/json",
                data: $scope.report
            }).success(function (result) {
                angular.copy(result, $scope.dynamicReport);

                if (!$scope.dynamicReport.Error) {
                    $scope.HideDynamicRepFunctions = false;
                    $scope.exportColumnSelected = $scope.dynamicReport.Columns[0]; //Set default for export drop down
                    //TABLE SIZING
                    var persentage = $scope.returnTableSizing(result.Columns.length);

                    $('[data-table=container]')
                        .css('margin-left', '25px')
                        .css('padding-right', '25px')

                        .css('width', persentage)
                        .css('max-width', persentage);  
                }
                else
                    alert("Error occured while generating the report, please contact helpdesk.");

            }).error(function (data) {
                alert("An error occured while generating the report, please try again.");
            });
        }

然后我将其更改为以下内容：

if ($scope.IsDinamicReport) {
            $http({
                method: "POST",
                url: "/api/DynamicReport/Post?pageNumber=" + $scope.PageNum + "&orderbyColumn=" + $scope.orderByColumn + "&sortOrder=" + $scope.sortOrder
                    + "&showNumberPagingStats=" + $scope.showNumberPagingStats,
                contentType: "application/json",
                data: $scope.report
            }).then(function (result) {
                angular.copy(result, $scope.dynamicReport);

                if (!$scope.dynamicReport.Error) {
                    $scope.HideDynamicRepFunctions = false;
                    $scope.exportColumnSelected = $scope.dynamicReport.Columns[0]; //Set default for export drop down
                    //TABLE SIZING
                    var persentage = $scope.returnTableSizing(result.Columns.length);

                    $('[data-table=container]')
                        .css('margin-left', '25px')
                        .css('padding-right', '25px')

                        .css('width', persentage)
                        .css('max-width', persentage);  
                }
                else
                    alert("Error occured while generating the report, please contact helpdesk.");

            }).catch(function (data) {
                alert("An error occured while generating the report, please try again.");
            });
        }

---

如果您在这里已经看不到错误，如何调试出错的地方？我唯一改变的就是不推荐使用的函数

使用调试器；在源代码中。

---

按F12、F8、F10。这将有助于从角度文档

$http

服务返回一个承诺，该承诺有两个回调，成功和失败（无捕获方法）

在您的代码中，您试图用catch处理拒绝，但文档中没有报告这一点

这是提供的语法，请尝试相应地修改代码

$http({
  method: 'GET',
  url: '/someUrl'
}).then(function successCallback(response) {
    // this callback will be called asynchronously
    // when the response is available
  }, function errorCallback(response) {
    // called asynchronously if an error occurs
    // or server returns response with an error status.
  });

---

来源：$http

使用标准的

。然后使用
和
。catch
承诺方法，但请注意方法签名和返回值不同：

之前：
之后：
$http(...)
  .success(function onSuccess(data, status, headers, config) {
  // Handle success
  //...
}).error(function onError(data, status, headers, config) {
  // Handle error
  //...
});

$http(...)
  .then(function onSuccess(response) {
    // Handle success
    var data = response.data;
    var status = response.status;
    var statusText = response.statusText;
    var headers = response.headers;
    var config = response.config;
    //...
    return <some value>;
}).catch(function onError(response) {
    // Handle error
    var data = response.data;
    var status = response.status;
    var statusText = response.statusText;
    var headers = response.headers;
    var config = response.config;
    //...
    throw <some error>;
});

$http({
    method: "POST",
    url: "/api/DynamicReport/Post?pageNumber=" + $scope.PageNum + "&orderbyColumn=" + $scope.orderByColumn + "&sortOrder=" + $scope.sortOrder
        + "&showNumberPagingStats=" + $scope.showNumberPagingStats,
    contentType: "application/json",
    data: $scope.report
//}).success(function (result) {
}).then(function (response) {
    //RESULT is a property of response
    var result = response.data;
    angular.copy(result, $scope.dynamicReport);

    if (!$scope.dynamicReport.Error) {
        $scope.HideDynamicRepFunctions = false;
        $scope.exportColumnSelected = $scope.dynamicReport.Columns[0]; //Set default for export drop down
        //TABLE SIZING
        var persentage = $scope.returnTableSizing(result.Columns.length);