从 JSON 对象数组返回特定​​对象

Question

这是我的 services.js 的样子：

    var app = angular.module('starter.services', [])


    .factory('Studies',function($http,$filter){
        var studies = [];
        $http.get("studies.json").success(
                function(data){
                    //studies = data;
                    angular.copy(data, studies);
                }
            );
        single_object = $filter('filter')(studies, function (d) {return d.nodeRef === "56e3382b-9a76-48ee-9c14-907e71b7a184";})[0];
        console.log(single_object);
      return {
        all: function(){
          return studies;
        }
    };
    })

如您所见，我对包含属性“nodeRef”的对象的 json 文件进行了获取请求，该文件恰好是一个属性。我想根据匹配的 noderef 过滤掉一个特定的对象。目前，console.log 返回“未定义”，我认为这可能是因为它在 json 文件加载之前就被调用了。如果有人可以提供解决方案，我将不胜感激。

Answer 1

您正在执行异步请求并在服务器响应之前触发过滤器，这就是您收到 undefined 的原因，因为此时您正在将过滤器应用于空数组。

您应该将您的过滤器调用移动到 success 块内，以使其按您的意愿工作：

var app = angular.module('starter.services', [])

.factory('Studies',function($http,$filter){
    var studies = [];
    $http.get("studies.json").success(
            function(data){
                //studies = data;
                angular.copy(data, studies);
                single_object = filter("56e3382b-9a76-48ee-9c14-907e71b7a184");
                console.log(single_object);
            }
        );
  function filter(node) {
    if (studies.length > 0) {
      return $filter('filter')(studies, function (d) {return d.nodeRef === node;})[0];
    }
  }
  return {
    all: function(){
      return studies;
    },
    filtered: filter
};
})

Answer 2

您是对的，控制台显示“未定义”，因为在 ajax 请求之后尚未填充研究。将过滤器和控制台日志移动到 .success 函数中：

$http.get("studies.json").success(
            function(data){
                //studies = data;
                angular.copy(data, studies);
                single_object = $filter('filter')(studies, function (d)  {return d.nodeRef === "56e3382b-9a76-48ee-9c14-907e71b7a184";})[0];
                console.log(single_object);
            }
        );

另外，我认为您需要在这里承诺在研究完成后更新研究。查看Angular $q

您将返回承诺，然后在 $http.success 函数中解决它，如下所示： var deferred = $q.defer(); .factory('Studies',function($http,$q,$filter){

    var studies = [];
    $http.get("studies.json").success(
            function(data){
                //studies = data;
                angular.copy(data, studies);
                //At this point you can filter data as required, or not at all. I would suggest returning the entire JSON response and not filtering here at all, let the controllers filter the data as needed to maintain a layer of separation between controller and service.

                deferred.resolve(studies);
            }
        );

  return {
    all: function(){
      return deferred.promise;
    }
};
//In your controller, or wherever else...
Studies.all().then(function(studies){ //this will fire when everything is all done. The studies variable is a full JSON object returned from the server (See deferred.resolve() in the service class). Filter here accordingly:
$scope.studies = $filter('filter')(studies, function (d) {return d.nodeRef === "56e3382b-9a76-48ee-9c14-907e71b7a184";})[0];
})