带$ http响应的角度过滤器

Question

我需要在需要进行$ http调用然后返回该响应的过滤器。 我正在尝试使用有角度的承诺，但没有任何效果。 返回不等待响应。 在下面查看我的代码。 返回{}，不等待$ http响应。 我只需要使用过滤器。 想法是将其与Controller分开，以便以后可以在任何地方使用。

.filter('filterXML',['testOne','$sce',function(testOne, $sce){

    return function(url){

       return testOne.getTest(url).then(function(data){
         return data;
        });

    }

 }])


.factory('testOne',  ['$http', function($http){
   return {
   getTest: function(url){
    return $http.get(url).success(function(data){
      console.log(data)
      return data;
    })
  }
 }
}])

目标：{{' http://rss.cnn.com/rss/cnn_topstories.rss '| filterXML}}

因此它将返回此rss feed中的所有数据。

我不想使用controller 。 想法是制作单独的模块并在应用程序中的任何位置调用它。

任何帮助将不胜感激 。 谢谢

Answer 1

您不应该在不是用于过滤器的过滤器中进行http调用。 过滤器通常通过对象数组传递，只有通过特定条件的对象才会在新的过滤后数组中返回。

我想您想进行这样的设置...

angular.module('foo', [])

.controller('someController', ['$scope', '$filter', 'testOne', function($scope, $filter, testOne){

    testOne.getTest('foo/bar').then(function(data){
      $scope.myFilteredData = $filter('filterXML')(data);
    });

}])


 .filter('filterXML', function() {
  return function(input) {
    // the condition on which to filter the input goes here...
    // this is just dummy code you will have to work out your own logic
    return (input === 'XML');
  };
});


.factory('testOne',  ['$http', function($http){
   return {
   getTest: function(url){
    return $http.get(url)
      .success(function(data){
        console.log(data)
        return data;
      });
  }
 }
}])

Answer 2

使用服务。 实际上，您已经创建了一个：

.factory('testOne',  ['$http', function($http){
   return {
   getTest: function(url){
    return $http.get(url).success(function(data){
      console.log(data)
      return data;
    })
  }
 }
}])

现在只需将$ testOne注入您的控制器，然后在您的控制器中执行以下操作：

var service = $testOne;
service.getTest('http:/some.url').then(function(response){ /*do something with the response */}); 

Answer 3

我不想使用controller。 想法是制作单独的模块并在应用程序中的任何位置调用它。

---

看到我想使我的代码与Controller分开。 否则每次我都必须将这些行放在每个控制器中。因此从过滤器中调用它，然后它就可以在我们将调用的任何地方运行。

---

我建议您将其转换为服务，然后（以便可以在任何地方使用），将要使用的所述服务的方法公开到$rootScope *（因为面对现实， filter不是您想要的东西）对于）。

---

app.service('someServiceName', function ($http) {
  function getStuff (url) {
    return $http.get(url).then(function (res) {
      return res;
    });
  }

  angular.extend(this, {
    getStuff: getStuff
  });
});

app.run(function ($rootScope, someServiceName) {
  $rootScope.getStuff = someServiceName.getStuff;
});

{{ getStuff(url) }}

---

*：我通常不建议将内容公开到$root ，但是如果不使用DI（如果我正确读取所有评论/答案/问题），您似乎已经死定了，这将在$scopes中进行被呈现。