У меня проблема с тем, что я использую фильтр в своем коде 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
извини, теперь ты можешь проверить ошибку
Вы «прикрепляете» 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
. Вы можете иметь отдельные файлы для ваших фильтров, так как рекомендуется иметь отдельные файлы для ваших контроллеров, служб и т. д.
Ваше здоровье!
Этого кода недостаточно, чтобы понять проблему. Не могли бы вы опубликовать полный код.