Question

我是一个代码新手，并试图学习angularjs。我的项目很简单：从API获取JSON数据并将其显示在网页上。我找到了发出http请求的函数，然后使用了数据：

 app.factory('myService', function($http) {
   var myService = {
     async: function() {
       var promise = $http.get('<URL to api>').then(function(response) {
         console.log(response);
         return response.data;
       });
       return promise;
     }
   };

   return myService;
 });

 app.controller('getRealTimeBusDataCtrl', function(myService, $scope) {

   myService.async().then(function(d) {
     $scope.data = d;
   });
 });

然后，我可以访问并显示整个JSON数据块或部分内容。

我想要做的是设置多个$ scope变量而不是一个，但是一旦我尝试，代码就会中断。

我想做的事情：

if (d.ResponseData.Buses[1].JourneyDirection = 1) {
  $scope.timeToSollentuna = d.ResponseData.Buses[1].DisplayTime;
  else if (d.ResponseData.Buses[1].JourneyDirection = 2) {
    $scope.timeToVallingby = d.ResponseData.Buses[1].DisplayTime;
  } else if (d.ResponseData.Buses[2].JourneyDirection = 1) {
    $scope.timeToSollentuna = d.ResponseData.Buses[2].DisplayTime;
  } else {
    $scope.timeToVallingby = d.ResponseData.Buses[2].DisplayTime;
  }
}

我猜测问题是如何设置功能：它以某种方式限制了我可以设置的变量数量或者我可以做的事情的数量＆＃34;做＆＃34;之后。但是我还没有找到另一种方法来做到这一点。

很抱歉，如果这个问题的答案显而易见，但我确实试图找到它并失败。

致以最诚挚的问候，

Answer 1

写入服务的方式是不必要的冗长。相反，我会像这样重写它（特别是如果你开始学习基础知识 - 开始学习好习惯会很好。）

app.factory('myService', ["$http", function($http){
    return {
        getData: function() {
            return $http.get('path/to/api');
        }
    };
}]);

app.controller('MainCtrl', ["$scope", "myService", function($scope, myService) {
    //declare your data model first
    $scope.busData = undefined;

    //use the service to get data
    myService.getData().then(function(response) {
        //success... got a response
        //this is where you can apply your data
        $scope.busData = response.data;

        //call a function to apply if you'd like
        applyBusData(response.data);
    }).catch(function(response) {
        //error has occurred
    });

    function applyBusData(data) {
        if(data.Buses[1].JourneyDirection === 1) {
            //etcc... etc...
        } else {
            //etc.. etc...
        }
    }
}]);

如何在angularjs控制器中使用来自http请求的数据？

1 个答案: