带$http response的Angular过滤器

Angular filter with $http response

本文关键字：Angular 过滤器 response http      更新时间：2023-09-26

我需要一个过滤器，我需要使$http调用，然后返回该响应。我试图使用角的承诺，但没有工作。Return不等待响应。下面是我的代码。它返回{}，而不是等待$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提要中的所有数据。

我不想使用controller。我们的想法是创建单独的模块，并在应用程序的任何地方调用它。

任何帮助将不胜感激。由于

你不应该在过滤器中进行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;
      });
  }
 }
}])

使用服务。实际上你已经创建了一个:

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

现在只需将$ teston注入到控制器中然后在控制器中执行:

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

我不想使用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，

相关文章：