Фильтр undefined в моем JavaScript в angular JS

У меня проблема с тем, что я использую фильтр в своем коде javascript и его работе, но проблема, которая отображается в консоли, отображается как ошибка. я использовал этот код для html:

 <input type = "range" min = "0" max = "100" step = "1" ng-model = "ctrl.inputAge" />
        100</p>
        <span>current min age: {{ ctrl.inputAge }}</span>
       <ul>
        <li ng-repeat = "person in ctrl.people | ageFilter:ctrl.inputAge ">{{ person.name }} ({{ person.age }})</li>

так что это мой код фильтра:

  var ctrl = this;

    ctrl.inputAge = 25;

.filter('ageFilter', function() {
    return function(input, minAge) {
      return input.filter(function (person) {
          return person.age >= +minAge;
      });
    }
  });

поэтому я обнаружил эту ошибку в своей консоли:

 TypeError: Cannot read property 'filter' of undefined

Этого кода недостаточно, чтобы понять проблему. Не могли бы вы опубликовать полный код.

Pawan Kotak 18.12.2018 10:20

извини, теперь ты можешь проверить ошибку

bryanghsb 18.12.2018 11:15
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
1
2
37
1

Ответы 1

Вы «прикрепляете» filter к существующему модулю? фильтр, определенный с помощью .filter (также при использовании .controller, .factory, .service и т. д.), должен существовать в области, определенной модулем. У вас есть рабочий пример ниже.

var app = angular.module("app", []);

app.controller("ctrl", function($scope) {
  $scope.myPersons = [{
    name: "Joe",
    age: 30
  }, {
    name: "Mary",
    age: 36
  }, {
    name: "George",
    age: 45
  }];
});

app.filter('ageFilter', function() {
  return function(items, threshold) {
    return items.filter(i => i.age > threshold);
  }
});
<script src = "https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.5/angular.min.js"></script>

<div ng-app = "app" ng-controller = "ctrl">
  {{ testString }}
  
  <div ng-repeat = "x in myPersons | ageFilter:35">
    {{ x.name }} - {{ x.age }} 
  </div>
</div>

Вы можете видеть, что я использовал app.filter, где ранее был определен app. Вы можете иметь отдельные файлы для ваших фильтров, так как рекомендуется иметь отдельные файлы для ваших контроллеров, служб и т. д.

Ваше здоровье!

Другие вопросы по теме