未知的自定义过滤器提供商Ionic/AngularJS

Unknown provider for custom filter Ionic/AngularJS

本文关键字：Ionic AngularJS 提供商过滤器自定义未知更新时间：2023-09-26

我试图实现一个自定义过滤器，但我得到以下错误:

错误:[$injector:unpr] Unknown provider: removeCharsFilterProvider <-removeCharsFilter

我的项目结构如下…

app.js:

var app = angular.module('myApp', ['ionic'])

myController.js:

app.controller('myController', ['$scope', 'removeChars',
  function($scope, removeChars) {
    //...
  }
]);

removeCharsFilter.js:

app.filter('removeChars', function() {
  return function(input) {
    return input.replace(/-/g, '').replace(/>/g, '');
  };
});

myView.html:

<div ng-controller="myController">
 <p>{{person.name | removeChars}}</p>
</div>

index . html

<!-- your app's js -->
<script src="js/app.js"></script>
<!-- filters -->
<script src="js/filters/removeCharsFilter.js"></script>
<!-- controllers -->
<script src="js/controllers/myController.js"></script>

我不知道为什么会发生这种情况，据我所知，这应该是工作。你能看出我漏掉了什么吗?

首先，你不需要在控制器中注入过滤器，它们是主应用程序的一部分，可以在任何控制器中使用$filter服务。

过滤器不是独立的单例对象，因此不需要作为依赖项包含。

既然你已经将它添加到控制器中，它正在寻找单例的服务或工厂，因此需要注入。但是在你的例子中，你有一个过滤器，而不是服务。

首先从控制器中移除removeChars。它给你$injector错误，因为它正在寻找不存在的服务或工厂。如果你想在控制器中使用过滤器，请使用风道。

app.controller('myController', ['$scope', '$filter',
   function($scope, $filter) {
   //use it like below if you  want to perform filters on data in controller
   $scope.someData = $filter('removeChars')(data);
  }
]);

如果你想在视图中使用过滤器，不需要管理它的依赖关系，直接在视图中使用，就像你使用的那样。

因此结论是，

过滤器不能加载作为控制器由于他们不是单的依赖。
过滤器可以在控制器中使用$ Filter
因此，它们可以直接应用于|管道分离器

希望这对你有帮助!

你得到这个错误是因为你在一个错误的方式使用$injector，根据AngularJS的D.I.文档，当你需要在视图外添加过滤器时，你必须在你的依赖项上添加 filter 后缀，这告诉$injector你需要一个过滤器!

angular.module('test', []).controller('TestCtrl', function(dateFilter) { console.log('DateFilter is', dateFilter); });

另一种$注入过滤器的方法，如前面的注释所述，是将您的过滤器请求到$filter服务。