Angular JS，工厂返回数据，但在控制器中它消失了

Angular JS, factory returns data, but in controller it is gone

本文关键字：控制器 消失了 数据 JS 工厂 返回 Angular      更新时间：2023-09-26

我已经开始学习一些关于AngularJS的知识。我设法创建了一些简单的控制器，但我想做一些重构并创建一个工厂。

这是我的一个js文件：

angular
.module('myApp', ['ngResource'])
.factory('UserFactory', ['$http', function ($http) {
    return {
        getOne: function () {
            $http({method: 'GET', url: 'http://localhost:8080/login/login'})
                .success(function (data, status, headers, config) {
                    console.info(data);
                    return data;
                })
                .error(function (data, status, headers, config) {
                    alert("failure");
                });
        }
    }
}])
.controller('UserController', ['$scope', 'UserFactory', function ($scope, UserFactory) {
    $scope.user = UserFactory.getOne();
}]);

程序将数据正确地打印到控制台，从该行的 servlet 接收到控制台：console.info(data);
但控制器不会向视图返回任何内容。我也放在这里console.info(UserFactory.getOne())，它打印undefined.

我的编码错误在哪里？

getOne需要返回一个值，在这种情况下，它将是来自$http的承诺。成功方法应返回控制器所需的值。

.factory('UserFactory', ['$http', function ($http) {
return {
    getOne: function () {
        return $http({method: 'GET', url: 'http://localhost:8080/login/login'})
            .success(function (data, status, headers, config) {
                return data;
            });
    }
}
}]);

现在，您可以在控制器中处理该结果。

app.controller('UserController', ['$scope', 'UserFactory', function ($scope, UserFactory) {
 UserFactory.getOne().then(function(data){
      $scope.user = data;
 });
}]);

success和failure方法已折旧。您应该尝试改用then。

.factory('UserFactory', ['$http', function ($http) {
return {
    getOne: function () {
        return $http({method: 'GET', url: 'http://localhost:8080/login/login'})
            .then(function (response) {
                return response.data;
            });
    }
}
}]);

您的工厂返回错误的位置，因此返回未定义。 您可以通过在控制器本身中处理成功来修复它。 试试这个。

var app = angular.module('plunker', []);
app.factory('UserFactory', ['$http', function ($http) {
   return {
       getOne: function (callback) {
          $http({method: 'GET', url: 'request_url'})
            .success(function (data, status, headers, config) {
                callback(data, status, headers, config);
            })
            .error(function (data, status, headers, config) {
                alert("failure");
            });
    }
}
}]);
app.controller('UserController', ['$scope', 'UserFactory', function ($scope, UserFactory) {
     UserFactory.getOne(function(data){
          $scope.user = data;
     });
}]);

工作网址 ： 演示

相关文章：