Что нового в Angular 4.4?

0
357
views

angular 4.4

Вышел Angular 4.4.1 (4.4.0 имел дефекты и так и не был выпущен). Это довольно небольшой релиз, содержащий исправления некоторых багов, но без особого увеличения функционала. Скоро должен выйти Angular 5.0, который принесет много нового, но придется подождать.

Давайте посмотрим, что есть в версии 4.4!

Производительность и preserveWhitespaces

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

Но использование этого флага может и сломать ваш макет, если он зависит от нескольких последовательных пробелов:) Вот почему значение по умолчанию для флага preserveWhitespaces однажды может стать false, хотя в настоящее время установлено в true. Если вы хотите установить значение false, вам пока придется сделать это вручную.

Вы можете настроить его глобально:

platformBrowserDynamic().bootstrapModule(AppModule, {
  preserveWhitespaces: false
});

или для отдельных компонентов:

@Component({
  selector: 'pr-home',
  templateUrl: './home.component.html',
  preserveWhitespaces: false
})
export class HomeComponent implements OnInit, OnDestroy {

Если вы действительно хотите оставить пробел, вы можете использовать специальный объект под названием
&ngsp;. Он похож на   с опечаткой, но это специальный символ, который компиллятор Angular преобразует в пробел. Запомните, что он сохранит только один пробел, даже если добавить последовательность таких символов (&ngsp;&ngsp;). Если вам действительно нужно сохранить несколько пробелов во фрагменте шаблона, вы можете использовать ngPreserveWhitespaces:

<div ngPreserveWhitespaces>hello     there</div>

Заметим, что выигрыш в размере кода или в скорости создания компонентов невелик, хотя и есть.

Возможность указывать несколько имен для exportAs

Не то чтобы это было важно, но это вторая и последняя особенность в этом релизе. Вы можете указать несколько имен для атрибута exportAs. Главным образом это нужно чтобы сделать возможным изменение имени существующих директив, сохраняя старые имена для обратной совместимости.

Например:

@Directive({
  selector: '[ns-ninja]',
  exportAs: 'ninja, superNinja'
})
export class NinjaDirective {

может использоваться как:

<div ns-ninja #foo="ninja">
<!-- or -->
<div ns-ninja #foo="superNinja">

Пока что это все важные изменения; ждем версию 5.0!

***
Подписывайтесь на наш канал в Telegram!


frontend logo

Хочешь проверить свои знания по фронтенду?

Подпишись на наш канал с тестами по HTML/CSS/JS в Telegram!

×

ОСТАВЬТЕ ОТВЕТ

Please enter your comment!
Please enter your name here