Я написал функцию фильтра, которая будет возвращать данные на основе аргумента, который вы передаете. Я хочу иметь такую же функциональность в своем контроллере. Можно ли повторно использовать функцию фильтра в контроллере?
Это то, что я пробовал до сих пор:
function myCtrl($scope,filter1)
{
// i simply used the filter function name, it is not working.
}
Вставить $фильтр на ваш контроллер
function myCtrl($scope, $filter)
{
}
Затем, где бы вы ни захотели использовать этот фильтр, просто используйте его так:
$filter('filtername');
Если вы хотите передать аргументы этому фильтру, сделайте это, используя отдельные круглые скобки:
function myCtrl($scope, $filter)
{
$filter('filtername')(arg1,arg2);
}
Где arg1
- это массив, который вы хотите фильтровать, и arg2
- это объект, который используется для фильтрации.
var anyNumber = $filter('number')(12.222222, 2);
чтобы получить 12.22
.
Ответ, предоставленный @Prashanth, верен, но есть еще более простой способ сделать то же самое. В основном вместо того, чтобы вводить зависимость $filter
и использовать неудобный синтаксис вызова его ($filter('filtername')(arg1,arg2);
), можно ввести зависимость: имя фильтра плюс суффикс Filter
.
Взяв пример из вопроса, который можно было бы написать:
function myCtrl($scope, filter1Filter) {
filter1Filter(input, arg1);
}
Следует отметить, что вы должны добавить Filter
к имени фильтра, независимо от того, какое соглашение об именах вы используете:
foo ссылается на вызов fooFilter
fooFilter ссылается на вызов fooFilterFilter
Используя следующий пример кода, мы можем фильтровать массив в контроллере angular по имени. это основано на следующем описании. http://docs.angularjs.org/guide/filter
this.filteredArray = filterFilter (this.array, {name: 'Igor'});
JS:
angular.module('FilterInControllerModule', []).
controller('FilterController', ['filterFilter', function(filterFilter) {
this.array = [
{name: 'Tobias'},
{name: 'Jeff'},
{name: 'Brian'},
{name: 'Igor'},
{name: 'James'},
{name: 'Brad'}
];
this.filteredArray = filterFilter(this.array, {name:'Igor'});
}]);
HTML
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Example - example-example96-production</title>
<script src="/angular.min.js"></script>
<script src="/script.js"></script>
</head>
<body ng-app="FilterInControllerModule">
<div ng-controller="FilterController as ctrl">
<div>
All entries:
<span ng-repeat="entry in ctrl.array">{{entry.name}} </span>
</div>
<div>
Filter By Name in angular controller
<span ng-repeat="entry in ctrl.filteredArray">{{entry.name}} </span>
</div>
</div>
</body>
</html>
Вот еще один пример использования filter
в контроллере Angular:
$scope.ListOfPeople = [
{ PersonID: 10, FirstName: "John", LastName: "Smith", Sex: "Male" },
{ PersonID: 11, FirstName: "James", LastName: "Last", Sex: "Male" },
{ PersonID: 12, FirstName: "Mary", LastName: "Heart", Sex: "Female" },
{ PersonID: 13, FirstName: "Sandra", LastName: "Goldsmith", Sex: "Female" },
{ PersonID: 14, FirstName: "Shaun", LastName: "Sheep", Sex: "Male" },
{ PersonID: 15, FirstName: "Nicola", LastName: "Smith", Sex: "Male" }
];
$scope.ListOfWomen = $scope.ListOfPeople.filter(function (person) {
return (person.Sex == "Female");
});
// This will display "There are 2 women in our list."
prompt("", "There are " + $scope.ListOfWomen.length + " women in our list.");
Простой, эй?
Предположим, что у вас есть следующий простой фильтр, который преобразует строку в верхний регистр с параметром только для первого символа.
app.filter('uppercase', function() {
return function(string, firstCharOnly) {
return (!firstCharOnly)
? string.toUpperCase()
: string.charAt(0).toUpperCase() + string.slice(1);
}
});
Непосредственно через $filter
app.controller('MyController', function($filter) {
// HELLO
var text = $filter('uppercase')('hello');
// Hello
var text = $filter('uppercase')('hello', true);
});
Примечание. Это дает вам доступ ко всем вашим фильтрам.
Назначьте $filter
a variable
Этот параметр позволяет использовать $filter
как a function
.
app.controller('MyController', function($filter) {
var uppercaseFilter = $filter('uppercase');
// HELLO
var text = uppercaseFilter('hello');
// Hello
var text = uppercaseFilter('hello', true);
});
Загрузите только конкретный Filter
Вы можете загрузить только определенный фильтр, добавив имя фильтра с помощью Filter
.
app.controller('MyController', function(uppercaseFilter) {
// HELLO
var text = uppercaseFilter('hello');
// Hello
var text = uppercaseFilter('hello', true);
});
Какой из них вы используете для личного предпочтения, но я рекомендую использовать третий, потому что это наиболее читаемый вариант.
function ngController($scope,$filter){
$scope.name = "aaaa";
$scope.age = "32";
$scope.result = function(){
return $filter('lowercase')($scope.name);
};
}
Имя метода контроллера 2-го аргумента должно быть "$ filter", тогда в этом примере будет работать только функция фильтра. В этом примере я использовал фильтр "нижний регистр".
У меня есть другой пример, который я сделал для своего процесса:
Я получаю массив со значением-Описание вроде этого
states = [{
status: '1',
desc: '\u2713'
}, {
status: '2',
desc: '\u271B'
}]
в файле Filters.js:
.filter('getState', function () {
return function (input, states) {
//console.log(states);
for (var i = 0; i < states.length; i++) {
//console.log(states[i]);
if (states[i].status == input) {
return states[i].desc;
}
}
return '\u2718';
};
})
Затем тестовый var (controller):
function myCtrl($scope, $filter) {
// ....
var resp = $filter('getState')('1', states);
// ....
}
AngularJs позволяет использовать фильтры внутри шаблона или внутри контроллера, директивы и т.д.
в шаблоне вы можете использовать этот синтаксис
{{ variable | MyFilter: ... : ... }}
и внутри контроллера вы можете использовать функцию $filter
angular.module('MyModule').controller('MyCtrl',function($scope, $filter){
$filter('MyFilter')(arg1, arg2);
})
Если вам нужно больше с демонстрационным примером, вот ссылка
Существует еще один способ оценить фильтры, которые отражают синтаксис из представлений. Вызов волосатый, но вы можете создать ярлык для него. Мне нравится, что синтаксис строки идентичен тому, что у вас было бы в представлении. Выглядит так:
function myCtrl($scope, $interpolate) {
$scope.$eval($interpolate( "{{ myvar * 10 | currency }} dollars." ))
}
Кажется, никто не упомянул, что вы можете использовать функцию arg2 в $filter ('filtername') (arg1, arg2);
Например:
$scope.filteredItems = $filter('filter')(items, function(item){return item.Price>50;});
Пример простой даты с использованием $filter в контроллере:
var myDate = new Date();
$scope.dateAsString = $filter('date')(myDate, "yyyy-MM-dd");
Как объясняется здесь - https://stackoverflow.com/questions/20131553/angularjs-convert-dates-in-controller
Используйте ниже код, если мы хотим добавить несколько условий вместо одного значения в javascript angular filter:
var modifiedArray = $filter('filter')(array,function(item){return (item.ColumnName == 'Value1' || item.ColumnName == 'Value2');},true)