如何调用服务方法从ng的变化的select在angularjs?

前端之家收集整理的这篇文章主要介绍了如何调用服务方法从ng的变化的select在angularjs?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我是新的角j。我试图调用工厂服务方法’getscoreData’从ng的变化,但不能够得到它完成。请帮忙。

HTML代码

  1. <select ng-model="score" ng-change="getscoreData(score)" ng-options="c.name for c in scores"></select>

Angularjs代码

  1. var app = angular.module('audiapp',[]);
  2.  
  3. app.controller('audiLayoutCtrl',function ($scope,scoreDataService) {
  4. scoreDataService.getscoreData($scope.score,function (data) {
  5. $scope.scoreData = data;
  6. });
  7. });
  8.  
  9. app.factory('scoreDataService',function ($http) {
  10. return {
  11. getscoreData: function (score,callback) {
  12. var params = {
  13. questionCode: score.code
  14. }
  15.  
  16. return $http({
  17. url: 'Home/GetAvgData',method: 'GET',params: params
  18. }).success(callback);
  19. }
  20. };
  21. });

上面是服务工厂方法并从控制器实例化。我尝试从ng的变化的选择实例化,但它既不给出错误也不得到调用

您的代码至少有两个问题:

> ng-change =“getscoreData(score)

Angular没有看到getscoreData方法引用定义的服务
> getscoreData:function(score,callback)

我们不需要使用回调,因为GET返回promise。然后改用。

这里是一个工作示例(我使用随机地址仅用于模拟):

HTML

  1. <select ng-model="score"
  2. ng-change="getscoreData(score)"
  3. ng-options="score as score.name for score in scores"></select>
  4. <pre>{{scoreData|json}}</pre>

JS

  1. var fessmodule = angular.module('myModule',['ngResource']);
  2.  
  3. fessmodule.controller('fessCntrl',function($scope,scoreDataService) {
  4.  
  5. $scope.scores = [{
  6. 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'
  7. },{
  8. name: 'London 8',London 8&sensor=true'
  9. }];
  10.  
  11. $scope.getscoreData = function(score) {
  12. scoreDataService.getscoreData(score).then(function(result) {
  13. $scope.scoreData = result;
  14. },function(result) {
  15. alert("Error: No data returned");
  16. });
  17. };
  18.  
  19. });
  20.  
  21. fessmodule.$inject = ['$scope','scoreDataService'];
  22.  
  23. fessmodule.factory('scoreDataService',['$http','$q',function($http) {
  24.  
  25. var factory = {
  26. getscoreData: function(score) {
  27. console.log(score);
  28. var data = $http({
  29. method: 'GET',url: score.URL
  30. });
  31.  
  32.  
  33. return data;
  34. }
  35. }
  36. return factory;
  37. }]);

演示Fiddle

猜你在找的Angularjs相关文章