Последние вопросы об Angular на собеседовании, которые вы должны подготовить к собеседованиям от начального до продвинутого уровня

Какие разные встроенные трубы доступны в Angular?

100 основных вопросов, которые вы должны подготовить к следующему собеседованию по Angular.

Получив много отзывов из моих предыдущих двух сообщений о вопросах на собеседовании по Angular, я подхожу к завершению, чтобы закончить ответы на оставшиеся вопросы.

Сегодня мы обсудим различные встроенные конвейеры, доступные в Angular.

Конвейеры - это простые функции, которые вы можете использовать в шаблонных выражениях, чтобы принимать входное значение и возвращать преобразованное значение.

Каналы полезны, потому что вы можете использовать их во всем приложении, объявляя каждый канал только один раз.

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

DatePipe: форматирует значение даты в соответствии с правилами локали.

Мы можем просто передать параметр с конвейером, чтобы получить преобразованные значения.

<h3>{{ name }} examples:</h3>
<p>
{{date | date:'mediumDate'}}<br>
{{date | date:'short'}}<br>
{{date | date:'long'}}<br>
{{date | date:'full'}}<br>
{{date | date:'shortDate'}}<br>
{{date | date:'mediumDate'}}<br>
{{date | date:'longDate'}}<br>
{{date | date:'fullDate'}}<br>
{{date | date:'shortTime'}}<br>
{{date | date:'mediumTime'}}<br>
{{date | date:'longTime'}}<br>
{{date | date:'fullTime'}}<br>
{{date | date:'h:m:s '}}<br>
{{date | date:'hh:mm:ss '}}<br>
</p>

Вы можете ознакомиться с живыми примерами здесь.

UpperCasePipe: преобразует текст в верхний регистр.

<div>{{ 'this is a BANANA.' | uppercase }}</div>

Вы можете ознакомиться с живыми примерами здесь.

LowerCasePipe: Преобразует текст в нижний регистр.

<div>{{ 'this is a BANANA.' | lowercase}}</div>

CurrencyPipe: преобразует число в строку валюты, отформатированную в соответствии с правилами локали.

Мы можем передать трехзначный код соответствующей страны, чтобы получить преобразованное значение.

<p>Euro: {{ 1 | currency:'EUR' }}</p>
<p>Brazilian Real: {{ 1 | currency:'BRL' }}</p>
<p>Turkish Lira: {{ 1 | currency:'TRY' }}</p>
<p>Georgian Lari: {{ 1 | currency:'GEL' }}</p>

DecimalPipe: преобразует число в строку с десятичной точкой, отформатированную в соответствии с правилами локали.

Этот канал поддерживает несколько диапазонов до десятичных и после десятичных знаков.

<div>
<p> {{num1 | number}} </p>
<p> {{num1 | number:'3.2-5'}} </p>
<p> {{num2 | number:'3.2-5'}} </p>
<p> {{num1 * num2 | number:'1.3-6'}} </p>
</div>

Вы можете ознакомиться с практическими примерами здесь.

PercentPipe: Преобразует число в процентную строку, отформатированную в соответствии с правилами локали.

Эта труба может преобразовывать любое значение в проценты.

<hello name="{{ name }}"></hello>
<p>
My Value is {{value}}
<br>
Its percent is {{value | percent }}
<br>
Its percent is without the % sign is {{ value * 100 | number }}
</p>

Вы можете ознакомиться с практическими примерами здесь.

Дальнейшее чтение:







Больше контента на plainenglish.io