Latest web development tutorials

AngularJS фильтр

Фильтры могут использовать символ вертикальной черты (|), чтобы добавить к выражений и инструкций.


AngularJS фильтр

AngularJS фильтр может быть использован для преобразования данных:

фильтр описание
валюта Формат номера отформатированы в качестве валюты.
фильтр Выбор подмножества элементов из массива.
в нижнем регистре Форматной строки в нижний регистр.
OrderBy расположение массива в соответствии с выражением.
верхний регистр Форматной строки в верхний регистр.

Добавить фильтр Выражения

Фильтруют через символ вертикальной черты (|), и фильтр добавляется к выражению. ,

((Два примера ниже, мы будем использовать в предыдущем разделе упоминалось контроллеры человека))

заглавная строка фильтра отформатированы как верхний регистр:

AngularJS примеры

<Div нг-приложение = "MyApp " нг-контроллер = "personCtrl">

<P> имя {{ЬавЬЫате | прописные}} < / p>

</ Div>

Попробуйте »

строчная фильтр строчной строки форматирования:

AngularJS примеры

<Div нг-приложение = "MyApp " нг-контроллер = "personCtrl">

<P> имя {{ЬавЬЫате | строчной}} < / p>

</ Div>

Попробуйте »

валюта фильтр

цифровой фильтр валюта будет отформатирован в формате валюты:

AngularJS примеры

<Div нг-приложение = "MyApp " нг-контроллер = "costCtrl">

<Тип входного = "число" нг -моделью = "количество">
<Тип входного = "число" нг -моделью = "цена">

<P> общая цена = {{(количество * цена) | валюта}} </ p>

</ Div>

Попробуйте »

Добавить фильтры инструкции

Фильтр через символ трубы (|), и фильтр добавляется к директиве.

OrderBy расположение массива фильтров в соответствии с выражением:

AngularJS примеры

<Div нг-приложение = "MyApp " нг-контроллер = "namesCtrl">

<Ul>
<Li нг-повтор = "х в названиях | OrderBy: 'страна'">
{{X.name + ',' + x.country}}
</ Li>
</ UL>

<Div>

Попробуйте »

входной фильтр

Входной фильтр через символ трубы (|) и фильтр добавляется к директиве, фильтр с последующим двоеточием и название модели.

фильтр фильтры выбора подмножества из массива:

AngularJS примеры

<Div нг-приложение = "MyApp " нг-контроллер = "namesCtrl">

<P> <входной тип = " текст" нг-модель = "тест"> </ p>

<Ul>
<Li нг-повтор = "х в названиях | фильтр: тест | OrderBy: 'страна'">
{{(X.name | в верхнем регистре) + ',' + x.country}}
</ Li>
</ UL>

</ Div>

Попробуйте »