2015-10-24 6 views
0

Я начал кое-что узнавать об AngularJS. Мне удалось создать несколько простых контроллеров, но я хотел бы сделать немного рефакторинга и создать также фабрику.Угловой JS, завод возвращает данные, но в контроллере он ушел

Вот один из моих 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(); 
}]); 

Программа корректно выводит данные в консоль, полученной из сервлета в этой строке: console.info(data);
Но контроллер ничего не возвращает к просмотру. Я также поставил здесь console.info(UserFactory.getOne()) и печатает undefined.

Где моя ошибка в кодировке?

+5

Если вы внимательно посмотрите на код, вы увидите, что вы ничего не возвращаете из своей функции getOne. – PSL

+3

Возможный дубликат [Как вернуть ответ от асинхронного вызова?] (Http://stackoverflow.com/questions/14220321/how-to-return-the-response-from-an-asynchronous-call) – MinusFour

ответ

2

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; 
      }); 
    } 
} 
}]); 
-1

Ваша фабрика возвращается в неправильном месте, поэтому она возвращается неопределенно. вы можете исправить это, успешно управляя самим контроллером. попробуй это.

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; 
    }); 
}]); 

РАБОЧЕЕ URL: DEMO

Смежные вопросы