반응형
ng-change of select in angularjs에서 서비스 방법을 호출하는 방법
저는 앵글J는 처음입니다.ng-change select에서 factory service method 'getScoreData'를 호출하려고 하는데 할 수 없습니다.제발 도와주세요.
HTML 코드:
<select ng-model="Score" ng-change="getScoreData(Score)" ng-options="c.name for c in Scores"></select>
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);
}
};
});
위는 서비스 팩토리 방식과 컨트롤러로부터의 인스턴스화 방식입니다.ng-change select에서 인스턴스화를 시도했지만 오류가 발생하지도 않고 호출도 되지 않습니다.
코드에는 다음 두 가지 이상의 문제가 있습니다.
ng-change="getScoreData(Score)
Angular는 볼 수 없습니다.
getScoreData
정의된 서비스를 참조하는 메서드getScoreData: function (Score, callback)
콜백을 사용할 필요가 없습니다.
GET
약속을 돌려드립니다.사용하다then
대신.
다음으로 동작 예를 나타냅니다(시뮬레이션에만 랜덤주소를 사용했습니다).
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;
}]);
데모
언급URL : https://stackoverflow.com/questions/20674220/how-to-call-service-method-from-ng-change-of-select-in-angularjs
반응형
'programing' 카테고리의 다른 글
nodejs 서버에 라이브 새로고침을 추가하려면 어떻게 해야 합니까? (0) | 2023.02.25 |
---|---|
문자열의 Gson 배열에서 Json Array로 (0) | 2023.02.25 |
WordPress에서 사용자 정의 양식을 만들려면 어떻게 해야 합니까? (0) | 2023.02.25 |
실 - 패키지의 각 종속성을 업데이트하려면 어떻게 해야 합니까?최신 버전으로 변경하시겠습니까? (0) | 2023.02.25 |
모듈을 찾을 수 없음: 오류:'react-dom/client'를 확인할 수 없습니다. (0) | 2023.02.25 |