AngularJS新手求助：如何将工厂数组数据传递至控制器

嘿，作为AngularJS新手，你当前的代码有个小误区——你的工厂直接操作了控制器的scope，这其实不符合Angular的设计逻辑（服务应该是独立、可复用的，不该依赖控制器的作用域）。下面我给你一步步拆解正确的实现方式：

第一步：重构工厂，让它返回数据而非直接操作scope #

我们要让buyFactory的Search方法返回一个Promise（因为$http请求是异步操作），把处理后的数据通过Promise传递出去，不再直接修改外部的scope。

修改后的工厂代码示例：

App.factory('buyFactory', ['$http', function($http) {
  var factory = {};

  factory.Search = function(d) {
    // 不再接收scope参数，避免直接操作外部作用域
    return $http.post(ajaxurl + '?action=search_car', d)
      .then(function(response) {
        // 处理返回的车辆数据
        var processedCars = [];
        angular.forEach(response.data, function(c) {
          c.price = parseFloat(c.price);
          c.driven = parseFloat(c.driven);
          c.year = parseFloat(c.year); // 补全你代码里未写完的parseFloat
          processedCars.push(c);
        });
        // 返回处理好的数组
        return processedCars;
      })
      .catch(function(error) {
        // 统一处理请求错误
        console.error('搜索车辆请求失败:', error);
        throw error; // 把错误抛出，让控制器也能捕获处理
      });
  };

  return factory;
}]);

第二步：在控制器中调用工厂方法，接收数据 #

在你的控制器里注入buyFactory，调用它的Search方法，通过Promise的then来获取处理后的数据，再赋值给scope变量：

App.controller('CarSearchController', ['$scope', 'buyFactory', function($scope, buyFactory) {
  $scope.triggerSearch = function() {
    $scope.isLoading = true;
    var searchParams = $scope.search; // 你的搜索参数

    buyFactory.Search(searchParams)
      .then(function(carsData) {
        $scope.CarsData = carsData; // 将工厂返回的数据绑定到scope
        $scope.isLoading = false;
      })
      .catch(function(error) {
        $scope.isLoading = false;
        // 这里可以给用户展示错误提示，比如$scope.errorMsg = '搜索失败，请重试'
      });
  };
}]);

为什么要这么做？ #

• 解耦设计：工厂不再依赖控制器的scope，任何控制器需要搜索车辆数据时，都能复用这个工厂方法
• 异步流程更清晰：Promise让异步请求的成功/失败逻辑更直观，错误处理也更集中
• 符合Angular最佳实践：服务负责数据的获取与处理，控制器只负责连接视图和数据

这样就能顺畅实现从工厂到控制器的数据传递啦！

内容的提问来源于stack exchange，提问作者Swati