javascript - 在 Angular js 1.6.2 中使用自定义过滤器

标签 javascript angularjs angularjs-ng-repeat angular-filters

下面的代码片段与 Angular 1.4.2 完美配合,但是在将 Angular js 库升级到 1.6.2 后。

我搜索了迁移/升级文档..等。没有找到解决办法。

HTML 代码:

<input ng-model="query" type="text" name="js_filter" >

作为我的自定义表的一部分,tbItems.rows 将包含一些数组/对象格式的数据

<tr ng-repeat-start="datarow in resultItems = (tbItems.rows | filter:magikFilterQuery ) " >

JavaScript 片段:

myControllers.controller('myContrBasic', ['$scope', '$http',
    function ($scope, $http) {

    $scope.magikFilterQuery = function (item) {
        var term;
        var part;
        if (angular.isUndefined($scope.query) === false) {
          if ($scope.matchcase === true) {
            term = item.data[3];
            part = $scope.query;
          }
          else {
            term = angular.lowercase(item.data[3]);
            part = angular.lowercase($scope.query);
          }
          if (term.indexOf(part) === -1) {
            return false;
          }
          else {
            return true;
          }
        }
        else {
          return true;
        }
      };

升级 Angular js 后出错:

angular.js:14362 Error: [$injector:unpr] http://errors.angularjs.org/1.6.2/$injector/unpr?p0=magikFilterQueryFilterProvider%20%3C-%20magikFilterQueryFilter
    at http://localhost/site82/folder/js/angular162/angular.min.js?v=8.2.6:6:425
    at http://localhost/site82/folder/js/angular162/angular.min.js?v=8.2.6:44:374
    at Object.d [as get] (http://localhost/site82/folder/js/angular162/angular.min.js?v=8.2.6:42:92)
    at http://localhost/site82/folder/js/angular162/angular.min.js?v=8.2.6:44:436
    at Object.d [as get] (http://localhost/site82/folder/js/angular162/angular.min.js?v=8.2.6:42:92)
    at http://localhost/site82/folder/js/angular162/angular.min.js?v=8.2.6:163:474
    at U (http://localhost/site82/folder/js/angular162/angular.min.js?v=8.2.6:125:13)
    at http://localhost/site82/folder/js/angular162/angular.min.js?v=8.2.6:123:123
    at q (http://localhost/site82/folder/js/angular162/angular.min.js?v=8.2.6:7:351)
    at U (http://localhost/site82/folder/js/angular162/angular.min.js?v=8.2.6:123:102) <!-- ngRepeat: datarow in  (tbItems.rows | magikFilterQuery ) as resultItems -->

最佳答案

您需要为您的函数 magikFilterQuery 定义一个过滤器,例如

angular.module('myApp').filter('magikFilterQuery', function() {
  return function(item) {
    var term;
    var part;
    if (angular.isUndefined($scope.query) === false) {
      if ($scope.matchcase === true) {
        term = item.data[3];
        part = $scope.query;
      }
      else {
        term = angular.lowercase(item.data[3]);
        part = angular.lowercase($scope.query);
      }
      if (term.indexOf(part) === -1) {
        return false;
      }
      else {
        return true;
      }
    }
    else {
      return true;
    }
  }
});

关于javascript - 在 Angular js 1.6.2 中使用自定义过滤器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42624998/

相关文章:

javascript - 在 Canvas 上的形状中制作随机颜色

javascript - 有没有办法在HTML5 canvas上画一个 "streak"(淡出 "digital phosphor"效果)?

angularjs - angular.js : how to pass ngclick from original dom to directive's dom?

angularjs - Angular ng-repeat 不起作用

javascript - 使用 ng-repeated 选项指定 Angular ngModel 值

javascript - ReactJS + JavaScript : How to parse array into a new array?

javascript - 如何使用jquery根据屏幕尺寸生成动态CSS

javascript - 在 NVD3 图表上添加引用线

angularjs - 如何使用 bootstrap 和 angularjs 折叠和展开菜单?

javascript - "Static"AngularJS 中的属性