AngularJS - Не удается вызвать http serrvice с использованием фабрики

Чтобы решить проблему, я просмотрел множество статей на разных сайтах, но никто не разрешил это. Я пишу простое приложение AngularJS. Я совершенно новый для Углового. Я написал метод фабрики, который вызывает службу $ http, которая получает данные из веб-api. Web api работает нормально и возвращает объект JSON, как ожидалось.AngularJS - Не удается вызвать http serrvice с использованием фабрики

Угловая Код

var app = angular.module("app", []) 
      .controller("controller", function ($scope, WebFactory) { 
       $scope.data = "data"; 
       $scope.error = "error"; 
       $scope.data=WebFactory.getData(); 

      }) 
      .factory("WebFactory", function ($http) { 
       var obj = {}; 

       obj.getData = function() 
       { 
        $http({ 
         method: "GET", 
         url: "http://localhost:37103/api/employee",      
        }).then(function success(response) { 
         return response.data; 
        }) 
        .then(function error(response) { 
         return response; 
        }); 
        return 'No data'; 
       } 
       return obj; 

      });

HTML код

<body ng-controller="controller"> 

data: {{data}} 
<br/> 
error: {{error}} 
<br />

Я провел 2 дня, но до сих пор не знаю, почему он не работает.

источник

2016-10-22 Rakesh Burbure

вы видите какие-либо ошибки в консоли? – Sajeetharan

Привет @Sajeetharan, я не вижу никаких ошибок, он говорит: «HTML1300: Навигация произошла». только. –

Ваш метод getData не имеет большого смысла. $ http() возвращает обещание, которое будет разрешено, когда вы получите ответ. Его асинхронный вызов. Итак, от получения данных вы возвращаете «Нет данных» в любом случае. Когда приходит ответ, вы просто обрабатываете его в обратном вызове, но потом ничего не использует. –

попробовать что-то вроде этого, вместо:

var app = angular.module("app", []) 
      .controller("controller", function ($scope, WebFactory) { 
       $scope.data = "data"; 
       $scope.error = "error"; 
       $scope.data = {} 
       WebFactory.getData().then(function success(response) { 
         $scope.data = response.data; 
        }); 
      }) 
      .factory("WebFactory", function ($http) { 
       var obj = {}; 

       obj.getData = function() 
       { 
        return $http({ 
         method: "GET", 
         url: "http://localhost:37103/api/employee",      
        }) 
       } 
       return obj; 
      });

источник

2016-10-22 11:16:32

Спасибо вам большое @ Владимир. Я получил ваше объяснение и его работу сейчас :) –

Прежде всего, вам не хватает в ng-app декларации

Во-вторых, вы злоупотребляете тогдашнее обратного вызова. Он принимает три параметра: обратный вызов успеха, обратный вызов ошибки, наконец, обратный вызов. Поскольку первый выполняет успех, он выполняет второй обратный вызов, который всегда возвращает ответ, но я предполагаю, что он не предназначен для этого, и вы можете использовать функцию get, которая более проста в использовании. Оно должно быть:

$http.get("http://localhost:37103/api/employee").then(function(response){ 
    //Do something with successfull response 
}, 
    function(error){ //do something with the error});

См документация о promises

Наконец, вы имеете дело с обещаниями и кодом асинхронного, но возвращение ответа или строки вместо обетования результата. Таким образом, GetData() должен выглядеть следующим образом:

obj.getData = function(){ 
    return $http.get("http://localhost:37103/api/employee"); 
}

И использовать тогда (успех, ошибка, в конце концов) обратных вызовов в контроллере или, если вы хотите, чтобы предоставить значения на ошибку /, наконец, обратные вызовы в службе, вы следует использовать $ Q услуги

obj.getData(){ 
var deferred = $q.defer(); 
$http.get(...).then(function(response){ 
     deferred.resolve(response.data); 
    }, 
    function(error){ 
     deferred.reject("No Data"); 
    }); 
    return deferred.promise; 
}

конечно, вы должны предоставить $ Q услуги в Webfactory

источник

2016-10-22 11:28:10 Operatorius

спасибо за ваш ответ, проблема была связана с асинхронным звонком, и Владимир предоставил разрешение и его рабочий тон в конце. –

И HTML, который я представил, был только частью страницы. благодаря –

AngularJS - Не удается вызвать http serrvice с использованием фабрики

ответ

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