正在将接收到的服务文件中的 Rest 数据发送到控制器 angularjs

Question

我是 angular js 的新手，我在将接收到的数据从我的服务文件发送到最终绑定到我的 html 的控制器时遇到问题。有人可以帮我解决这个问题吗？谢谢。

服务文件

"use strict";

angular.module("fleetListModule").service("fleetsService",

 function ($http) {
             this.getTrucks = function () {
                 console.log("before calling webservice");
                 $http.get('http://localhost:8080/login/rest/truckservices/getTrucks?truckId')
                 .success(function (data){
                     var trucks = data;
                     console.log("after calling webservice my data is", trucks);
                     return trucks;
                 });

             };            
         });

控制器

"use strict";

angular.module("fleetListModule").controller("fleetListController",
    ['$scope', 'fleetsService',  
function ($scope, fleetsService) {

   var truckData = fleetsService.getTrucks();
   console.log("inside fleet service", truckData);
   $scope.trucks = truckData;        
    console.log("outside fleet service", truckData);
 }]);

html

<div class="panel1 panel-primary">
    <div class="panel-heading" align="center">TRUCKS</div>
    <table class="table  table-condensed table-striped " >
        <thead class="truck-list-header">
            <tr class="truck-list-header">
                <th>Truck ID</th>
                <th>Status</th>
                <th>Dest.</th>
                <th>Alerts</th>
            </tr>
        </thead>
        <tbody>
            <tr ng-repeat="truck in trucks" ng-click="summaryData(truck)" class="truck-list-body">
                <td>
                    <div><i class="fa fa-truck truck-icon"></i>{{truck.truckId}}</div>
                </td>
                <td>
                <span class="label {{truck.label}}">{{truck.status}}</span>
                </td>
                <td>{{truck.destination}}</td>
                <td>
                    <div><i class="fa fa-exclamation-triangle alert-icon"></i>{{truck.alerts}}</div>
                </td>
            </tr>
        </tbody>
    </table>
</div>

json 从本地主机 8080 接收数据

{"truckId":"111","status":"Running","destination":"Winnipeg","alerts":"Nothing"}

Answer 1

您的服务函数没有 return 任何东西。 success 里面的 return 什么都不做

使用 then 的简化版服务，因为 success 已弃用：

this.getTrucks = function() {
  console.log("before calling webservice");
  // return the promise created by `$http`
  return $http.get('http://localhost:8080/login/rest/truckservices/getTrucks?truckId')
    .then(function(responsePromise) {
      var trucks = responsePromise.data;
      console.log("after calling webservice my data is", trucks);
      return trucks;
    });

};

在控制器中

 fleetsService.getTrucks().then(function(truckData) {
   // assign data inside promise callback
   console.log("inside fleet service", truckData);
   $scope.trucks = truckData;

 });
 // can't do this one , it will run before data has been returned from server    
 console.log("outside fleet service", $scope.trucks);//will be undefined

正在将接收到的服务文件中的 Rest 数据发送到控制器 angularjs

Sending received Rest data in service file to controller angularjs

javascript

web-services

angularjs

angularjs-service

angularjs-controller