0

在我的 Angular 应用程序中，我有一个baseController.js类和一个类，它们可以通过将自己的范围注入 baseControllerexampleController.js来访问定义的函数。baseController这允许在所有控制器之间共享功能。

这是有效的，除非我尝试getDataFromUrl()从exampleController. 在调试时我可以看到它getDataFromUrl()被调用了，它进入了调用的.success()函数$http.get()。那时我可以看到它data是一个反序列化的 JSON 对象（在这种情况下，它是一个对象数组）但是当代码最终返回到它exampleController的initArray()函数时data，它最终收到的不再是反序列化的对象，而是变成了原始 HTTP 响应数据。

baseController.js：

// Data retrieval function for all derived controllers
$scope.getDataFromUrl = function (url) {
    return $http.get(url)
    .success(function (data) {
        return data;
    })
    .error(function () {
        return null;
    });
};

示例控制器.js：

appModule.controller('exampleController', [
        '$scope', '$controller', '$http', '$window', '$location', '$timeout',
        function ($scope, $controller, $http, $window, $location, $timeout) {
            var base = $controller('baseController', { $scope: $scope });

            // Initiate an array of data
            var initArray = function (data) {
                $scope.sortedArray = sortDataByDate(data);
            };

            // Calling function in scope defined by base controller class
            $scope.getDataFromUrl('resources/data').then(function (data) {
                initArray(data);
            });
}]);

为什么data返回exampleController为 HTTP 响应？我希望它保持为反序列化的 JSON！

4

2 回答 2

1

和回调不应该属于你的success函数。此外，您不能像异步调用那样将数据返回给调用者。相反，该函数应该向调用返回一个承诺，然后处理来自调用者的成功。这是一种方法。errorgetDataFromUrl()$http

$scope.getDataFromUrl = function (url) {
  // return a promise to the async action and handle `success` and `error` in the caller
  return $http.get(url);
};

// for example
$scope.getDataFromUrl('resources/data').then(function (data) {
  initArray(data);
});
// or
$scope.getDataFromUrl('resources/data').success(function (data) {
  initArray(data);
}).error(function() {
  alert('Server error');
});
于 2014-08-06T15:36:15.593 回答
0

想通了，我得到了原始响应数据，因为.then()没有触发，.success()所以到达子控制器的数据从一开始就没有反序列化。这是正确的代码：

baseController.js：

// Data retrieval function for all derived controllers
$scope.getDataFromUrl = function (url, successFunction) {
    $http.get(url)
    .success(function (data) {
        successFunction(data);
    })
    .error(function () {
        return null; // Or whatever you want to return
    });
};

示例控制器.js：

appModule.controller('exampleController', [
        '$scope', '$controller', '$http', '$window', '$location', '$timeout',
        function ($scope, $controller, $http, $window, $location, $timeout) {
            var base = $controller('baseController', { $scope: $scope });

            // Initiate an array of data
            var initArray = function (data) {
                $scope.sortedArray = sortDataByDate(data);
            };

            // Calling function in scope defined by base controller class
            $scope.getDataFromUrl('resources/data', function (data) {
                initArray(data);
            });
}]);
于 2014-08-08T14:48:22.707 回答