2013-04-26 13 views
37

Próbuję zrozumieć pojęcie fabryki i serwisu w Angular. Mam następujący kod pod kontrolką:

init(); 

    function init(){ 
     $http.post('/services', { 
      type : 'getSource', 
      ID : 'TP001' 
     }). 
     success(function(data, status) { 
      updateData(data); 
     }). 
     error(function(data, status) { 

     }); 

     console.log(contentVariable); 
    }; 
    function updateData(data){ 
     console.log(data); 
    }; 

Ten kod działa poprawnie. Ale kiedy przenoszę usługę $ http do fabryki, nie mogę zwrócić danych z powrotem do kontrolera.

studentApp.factory('studentSessionFactory', function($http){ 
    var factory = {}; 
    factory.getSessions = function(){ 
     $http.post('/services', { 
      type : 'getSource', 
      ID : 'TP001' 
     }). 
     success(function(data, status) { 
      return data; 
     }). 
     error(function(data, status) { 

     }); 
    }; 
    return factory; 
}); 

studentApp.controller('studentMenu',function($scope, studentSessionFactory){ 
    $scope.variableName = []; 
    init(); 
    function init(){ 
     $scope.variableName = studentSessionFactory.getSessions(); 
     console.log($scope.variableName); 
    }; 
}); 

Czy istnieje zaletą korzystania z fabryki, ponieważ $ http działa nawet w kontrolerze

Odpowiedz

88

Celem ruchu usługę studentSessions z kontrolera jest uzyskanie separacji obawy. Zadaniem twojej usługi jest wiedzieć, jak rozmawiać z serwerem, a zadaniem kontrolera jest tłumaczenie danych widoku i danych serwera.

Ale mylisz swoje asynchroniczne procedury obsługi i co powraca. Regulator musi jeszcze powiedzieć usługę, co zrobić, gdy dane są odbierane później ...

studentApp.factory('studentSession', function($http){ 
    return { 
     getSessions: function() { 
      return $http.post('/services', { 
       type : 'getSource', 
       ID : 'TP001' 
      }); 
     } 
    }; 
}); 

studentApp.controller('studentMenu',function($scope, studentSession){ 
    $scope.variableName = []; 

    var handleSuccess = function(data, status) { 
     $scope.variableName = data; 
     console.log($scope.variableName); 
    }; 

    studentSession.getSessions().success(handleSuccess); 
}); 
+1

Dzięki Brian. Teraz ma sens. Otrzymuję komunikat "missing missing error error after property list". Błąd występuje po zamknięciu, dodając ścisłą parantezę dla powrotu w fabryce. –

+0

Oki naprawił część parantyczną. Teraz kod jest 'studentApp.factory ('studentSession', function ($ http) {return { getSessions: function() {return $ http.post ('/ usługi', { typu: 'getSource', ID: 'TP001' }); } } }); "Teraz otrzymałem komunikat o błędzie" Błąd b nie jest funkcją ". Nie mam żadnej funkcji o nazwie b. Wszelkie sugestie na temat tego, co powoduje ten błąd? –

+0

Dzięki. Brakowało mi tego klamry. Jeśli chodzi o "b nie jest funkcją", czy używasz jakiegoś rodzaju minifikacji kodu lub uciążliwości? –

8

Pierwsza odpowiedź jest wielki, ale może można to zrozumieć:

studentApp.factory('studentSessionFactory', function($http){ 
    var factory = {}; 

    factory.getSessions = function(){ 
     return $http.post('/services', {type :'getSource',ID :'TP001'}); 
    }; 

    return factory; 
}); 

Następnie:

studentApp.controller('studentMenu',function($scope, studentSessionFactory){ 
     $scope.variableName = []; 

     init(); 

     function init(){ 
      studentSessionFactory.getSessions().success(function(data, status){ 
       $scope.variableName = data; 
      }); 
      console.log($scope.variableName); 
    }; 
}); 
+0

Wygląda na dobrą odpowiedź, ale '.success' jest teraz przestarzałe, wydaje się, że http://stackoverflow.com/questions/33531336/angularjs-error-success-is-not-a-function # 33531521. – SharpC

Powiązane problemy