-1

我是 AngularJS 的新手，并设法让它工作。如果以“Angular 方式”完成，我可以获得一些反馈吗？

DataResults 服务只是获取一些 JSON 数据，最终会有更多的方法来处理它。我最好奇的部分是控制器。它等待服务完成，然后将数据带入范围。HTML 用它做了一些事情，但与此无关。

谢谢你的时间

var myApp = angular.module("myApp ", []);
myApp.factory("DataResults",function($http) {
  var data = [];

  var promise = $http.get("/js/data.json").
    success(function(d, status, headers, config) {
      data= _.compact(d);
    }).
    error(function(d, status, headers, config) {
      return "Error!";
    });

  promise.getData= function() {
    return data;
  };
  /* More methods */

  return promise;
});

/* Controllers */
myApp.controller("DataSearchCtrl", ["$scope", "DataResults", function($scope, DataResults) {
  DataResults.then(function() {
    $scope.data = DataResults.getData();
  });
}]);

编辑：我无法评论。是的，它确实有效。

4

2 回答 2

1

是的，这就是 Angular 的方式！但是，我想建议一些修改。

使用您当前的实现，每次注入"DataResults"控制器时，您都会$http.get在页面加载时发出请求。当您需要添加不同的$http.get功能时会发生什么？
我会将$q服务注入您的"DataResults"工厂，这将使您具有更大的灵活性。将$q服务与 Deferred API 一起使用，您不仅会返回一个 Promise，而且该 Promise 会使用值本身来解决。

更新工厂：

var myApp = angular.module("myApp ", []);
myApp.factory("DataResults",function($http,$q) {

return {  
  getJsonData: function(){ 
    var deferred = $q.defer();
    $http.get("/js/data.json").
      success(function(d, status, headers, config) {
        deferred.resolve(_.compact(d));
      }).
      error(function(d, status, headers, config) {
        deferred.reject(d);
      }); 
    return deferred.promise;
  },
  getSomeOtherData: function(){
    var deferred = $q.defer();
    $http.get("/js/data.json").
      success(function(d, status, headers, config) {
        deferred.resolve(_.compact(d));
      }).
      error(function(d, status, headers, config) {
        deferred.reject(d);
      }); 
    return deferred.promise;
  }  
};

});

更新的控制器：

myApp.controller("DataSearchCtrl", ["$scope", "DataResults", 
 function($scope, DataResults) {

  $scope.initializePage = function(){
    DataResults.getJsonData().then(function(jsonData) {
      $scope.data = jsonData;
    });
  };

  $scope.loadTheOtherData = function(){
    DataResults.getSomeOtherData().then(function(someOtherData){
        $scope.otherData = someOtherData;
    });
  }; 
}]);
于 2013-10-01T21:53:52.610 回答
-2

我发现我经常不得不将 $scope.$digest() 放在我的控制器中。尤其是在设置了一些数据之后，例如 $scope.data = DataResults.getData()。在dev中，我们发现这种情况并没有经常出现，（一定和时序有关），但是在我们生产运行的代码中，经常看到数据丢失，只好回去放入$scope.$ apply() 或 $scope.$digest()。

于 2013-10-01T20:42:23.863 回答