angularjs - change - select angular 5

¿Cómo llamar al método de servicio desde ng-change of select en angularjs?

Question

Soy nuevo en angular js. Estoy tratando de llamar al método de servicio de fábrica ''getScoreData'' desde ng-change of select, pero no puedo hacerlo. por favor ayuda.

Código HTML:

<select ng-model="Score" ng-change="getScoreData(Score)" ng-options="c.name for c in Scores"></select>

Código Angularjs:

var app = angular.module(''audiapp'', []);
app.controller(''audiLayoutCtrl'', function ($scope, ScoreDataService) {
ScoreDataService.getScoreData($scope.Score, function (data) {
$scope.ScoreData = data;
});
});
app.factory(''ScoreDataService'', function ($http) {
return {
getScoreData: function (Score, callback) {
var params = {
questionCode: Score.code
}
return $http({
url: ''Home/GetAvgData'',
method: ''GET'',
params: params
}).success(callback);
}
};
});

arriba está el método de fábrica de servicio y su instancia desde el controlador. Intenté crear instancias desde ng-change of select, pero no da error ni se llama.

Answer 1

Tienes al menos dos problemas en tu código:

• ng-change="getScoreData(Score)

  Angular no ve el método getScoreData que se refiere al servicio definido

• getScoreData: function (Score, callback)

  No necesitamos utilizar la devolución de llamada ya que GET devuelve la promesa. Utilice then lugar.

Aquí hay un ejemplo de trabajo (usé una dirección aleatoria solo para simulación)

HTML

<select ng-model="score"
ng-change="getScoreData(score)"
ng-options="score as score.name for score in scores"></select>
<pre>{{ScoreData|json}}</pre>

JS

var fessmodule = angular.module(''myModule'', [''ngResource'']);
fessmodule.controller(''fessCntrl'', function($scope, ScoreDataService) {
$scope.scores = [{
name: ''Bukit Batok Street 1'',
URL: ''http://maps.googleapis.com/maps/api/geocode/json?address=Singapore, SG, Singapore, 153 Bukit Batok Street 1&sensor=true''
}, {
name: ''London 8'',
URL: ''http://maps.googleapis.com/maps/api/geocode/json?address=Singapore, SG, Singapore, London 8&sensor=true''
}];
$scope.getScoreData = function(score) {
ScoreDataService.getScoreData(score).then(function(result) {
$scope.ScoreData = result;
}, function(result) {
alert("Error: No data returned");
});
};
});
fessmodule.$inject = [''$scope'', ''ScoreDataService''];
fessmodule.factory(''ScoreDataService'', [''$http'', ''$q'', function($http) {
var factory = {
getScoreData: function(score) {
console.log(score);
var data = $http({
method: ''GET'',
url: score.URL
});
return data;
}
}
return factory;
}]);

Demo Fiddle