получить данные с сервера и отобразить их на выбранном событии с помощью $ http service и ng-change

Question

Я новичок в Angular и хотел бы узнать, как выполнить эту задачу У меня есть раскрывающийся список, содержащий список LotType. Когда тип Лот selected.I хотите сделать HTTP GET вызов метода веб-API, который возвращает список лотов в зависимости от выбранного типа

Мои app.js

app.factory('LotService',['$http',function($http){ 
    var factory={}; 
    factory.getLots=function(selectionType){ 
     $http.get('http://localhost:8080/planification/lots/',{ 
     params:{ 
      "type":selectionType 
     } 
     }) 
     .success(function(data){ 
      Lots=data; 
     }) 
    } 
    return factory; 
}]); 

app.controller("ExampleController",['$scope','LotService',function($scope,LotService){ 

    $scope.Types=['particulier','admin','indus']; 
    $scope.getLots=function(selectionType){ 
    $scope.Lots=LotService.getLots(selectionType); 
    } 
    $scope.getLots(selectionType); 
}]); 

мой index.htm

<div class="form-group"> 
    <label class="col-sm-3 control-label">Type client</label> 
    <div class="col-sm-9"> 
     <select class="selectpicker form-control" multiple ng-model="test.type" ng-change="getLots(test.type)"> 
      <option ng-repeat="type in Types" value="{{type}}">{{type}}</option> 
     </select> 
    </div> 
</div> 
<div class="form-group"> 
    <label class="col-sm-3 control-label">Lot </label> 
    <div class="col-sm-9"> 
     <select class="selectpicker form-control" ng-model="test.lot"> 
      <option ng-repeat="lot in Lots" value="{{lot}}">{{lot}}</option> 
     </select> 
    </div> 
</div> 

Answer 1

проблема заключается служба не имеет доступа к области действия контроллера (как должно быть, поскольку услуги должны быть использованы любым контроллером в случае необходимости). Вместо этого вы должны вернуть обещание, возвращенное http.get:

factory.getLots=function(selectionType{ 
    return $http.get('http://localhost:8080/planification/lots/', 
     { params: { "type":selectionType } }); 
} 

Затем на контроллере используют данные:

$scope.lots = lotsFactory.getLots().success(function(data) { 
    $scope.lots=data; 
}); 

Answer 2

Функция getLots в вас службе необходимо вернуть обещание, а затем отложить значение которую вы получаете, делая вызов $ http. В вашем контроллере используйте. Then, чтобы дождаться окончания HTTP-вызова, а затем привяжите данные к переменной области видимости.

app.factory('LotService',['$http' '$q',function($http, $q){ 
    var factory={}; 
    factory.getLots=function(selectionType){ 
    var defer = $q.defer(); 
     $http.get('http://localhost:8080/planification/lots/',{ 
     params:{ 
      "type":selectionType 
     } 
     }) 
     .success(function(data){ 
      defer.resolve(data) 
     }) 
    return defer.promise; 
    } 
    return factory; 
}]); 

app.controller("ExampleController",['$scope','LotService',function($scope,LotService){ 

    $scope.Types=['particulier','admin','indus']; 
    $scope.getLots=function(selectionType){ 
    LotService.getLots(selectionType).then(function(data) { 
    $scope.Lots = data; 
}) 
    } 
    $scope.getLots(selectionType); 
}]); 

EDIT
Я создал скрипач для решения. Проверьте это here. Я не могу сделать $ http-звонок от Fiddler, поэтому я высмеивал данные. Данные попадают в раскрывающийся список выбора.