控制器

Question

我正在尝试显示我从服务器获取的日期，我能够检索它并在服务中正确显示它，但是在我的控制器中，它是未定义的，你会帮我解决这个问题。 这是我的服务

function footerService($http,$filter) {
var dateFormat = 'yyyy-MM-dd';
var statusDate = {};

statusDate.getStatusDate = function() {
    $http.get(_contextPath + "/getDate", {}).success(
            function(response) {
                console.log('response', response)
                statusDate.Date = $filter('date')(
                        new Date(response.Date), dateFormat);
                console.log('Date', statusDate.Date)
                return statusDate.Date;
            });
};
return statusDate;

};

并在我的控制器中

function footerController($scope,footerService) {
$scope.myDate = footerService.getStatusDate();
console.log('$scope.myDate', $scope.myDate);
};

Answer 1

您可以使用$q.defer：

function footerService($http,$filter) {
    var dateFormat = 'yyyy-MM-dd';
    var statusDate = {};

    statusDate.getStatusDate = function() {
        var deferred = $q.defer();

        $http.get(_contextPath + "/getDate", {}).success(
            function(response) {
                statusDate.Date = $filter('date')(
                        new Date(response.Date), dateFormat);
                deferred.resolve(statusDate.Date );
            });

       return deferred;
    };

  return statusDate;

};

然后：

footerService.getStatusDate()
.then(function(data) {
   $scope.myDate = data;
});

Answer 2

使用$http表示使用异步Promises。 您可以使用then定义异步调用成功时发生的情况：

footerService.getStatusDate()
.then(function(receivedDate) {
   $scope.myDate = receivedDate;
   console.log('$scope.myDate', $scope.myDate);
});

另外，请勿忘记return getStatusDate中的return $http.get...。

有关async Promises的更多信息：https://docs.angularjs.org/api/ng/service/ $ q

Answer 3

function footerService($http, $filter) {
    return {
        getStatusDate = function() {
            return $http.get(_contextPath + '/getDate', {});
        }
    };
}

function footerController($scope, footerService) {
    $scope.myDate;

    footerService.getStatusDate().then(function(response){
        $scope.myDate = response.data.Date;
    }).catch(function(response){
       //error 
    });
}

Answer 4

在服务中，您需要从$ http请求中返回承诺。

尝试：

function footerService('$http', [$http]) {
    var statusDate = {};

    getStatusDate = function() {
        return $http.get(_contextPath + "/getDate", {})
    };
    return {
        getStatusDate: getStatusDate
    };

};

你的控制器是这样的：

function footerController($scope,footerService) {
    footerService.getStatusDate().then(function(results) {
        $scope.myDate = results.data;
    });
    $scope.$watch(function() {return $scope.myDate;}, function() {
        console.log('$scope.myDate', $scope.myDate);
    });

};

您可以在控制器的.then（）方法中应用过滤器逻辑。

Answer 5

因为.success（function（）{}）是回调，所以你不能从那里返回任何值。它是将一个successCallback从控制器传递到getStatusDate并将.success（function（response）{}）的预期响应传递给successCallback的最佳解决方案。 通过这样做，您将能够在控制器中获得服务响应。

代码如下：

function footerService($http,$filter) {
  var dateFormat = 'yyyy-MM-dd';
  var statusDate = {};

  statusDate.getStatusDate = function(successCallback) {
      $http.get(_contextPath + "/getDate", {}).success(
            function(response) {
                successCallback($filter('date')(new Date(response.Date), dateFormat));
            });
  };
  return statusDate;

};


function footerController($scope, footerService) {
     function successCallback(res) {
         $scope.myDate = res;
         console.log('$scope.myDate', $scope.myDate);   
     }

     footerService.getStatusDate(successCallback);
};