アヤックス

Question

作成された角度のサービス：

calculator_app.service('FillOpportunity', function() { 
    this.fill_opportunity = function (path,scope) { 

     $.ajax({ 
      url: 'opportunitycalculator/calculator/GetProducts?idstring=' + path, 
      type: "GET", 
      cache: false, 
      contentType: "application/json; charset=utf-8", 
      dataType: "json", 
      success: function (data) 
      { 
       scope.opportunity_data = data; 
       scope.$apply(); 

      }, 
      error: function() { 
      } 
     }); 
    }; 
}); 

ドロップダウンngの変更と呼ばれるサービス：

FillOpportunity.fill_opportunity($scope.result_path,$scope); 

scope.opportunity_dataがUIで選択するためにバインドされます。

<select id="seloppurtunityproducts" name="selproducttype" multiple="" style="height:300px" ng-model="opportunity_products" ng-options="a for a in opportunity_data"></select> 

ng-Changeでは、Network of ChromeをチェックインするとAjaxが呼び出されますが、値は選択ボックスで更新されません。

入力はありますか？

Answer 1

jQueryのajaxは使用しないでください。組み込みの$httpを使用してください。 $httpを使用すると、angleの組み込みコンパイラのダイジェストサイクルが自動的に開始されます。 jqueryを使わなければならない場合は、$ scopeを呼び出さなければなりません。$ apply（）;データが変更される度に

サービス：

calculator_app.factory("calcService", ["$http", function($http) { 
    return { 
     getItem: function(url, items) { 
      return $http.get(url, 
       // query string like { userId: user.id } -> ?userId=value 
       { params: items }); 
     } 
    } 
}]); 

あなたのコントローラと使用にサービスを注入：

calculator_app.controller("MainCtrl", ["calcService", "$scope", function(calcService, $scope) { 
    $scope.opportunity_data = []; 

    var payload = { 
     idstring: path 
    }; 

    //call the service 
    calcService.getItem('path/to/calc/api', payload).then(function(response) { 
      $scope.opportunity_data = response.data; 
     }).catch(function(response) { 
      alert('error' + response.data); 
     }); 
}]);