RxJS Pipeable Operators

Использование в 5.4

import { Observable } from 'rxjs/Observable';
import 'rxjs/add/observable/of';
import 'rxjs/add/operator/filter';
import 'rxjs/add/operator/map';

Observable.of(1, 2, 3)
    .filter(x => x % 2 === 0)
    .map(x => x + x)
    .subscribe(x => console.log(x));

Использование в 5.5

import { of } from 'rxjs/observable/of';
import { filter, map } from 'rxjs/operators';

of(1, 2, 3).pipe(
    filter(x => x % 2 === 0)
    map(x => x + x)
).subscribe(x => console.log(x));

Зачем использовать pipeable operators?

  • Tree-shakable. Операторы, которые являются частью прототипа Observable и не используются в коде, во время сборки не удаляются webpack'ом или другим бандлером.
  • Упрощается создание собственных операторов
  • Транспайлеры и линтеры предлагает больше подсказок

Pipeable Operators

Похожие записи

Как добавить ng-bootstrap компоненты в проект Angular-CLI?

Покажу на примере нового проекта.

ng new project_name
cd project_name
npm install --save bootstrap@next
npm install --save @ng-bootstrap/ng-bootstrap

В angular-cli.json в секцию style надо добавить наш CSS, чтобы глобально подключить стили.

  "styles": [
    "styles.css",
    "../node_modules/bootstrap/dist/css/bootstrap.min.css"
  ],
17 августа 2017 г. в Angular

Отладка Angular в VS Code

Настройка Visual Studio Code используя расширение Debugger for Chrome для отладки Angular приложений
03 декабря 2017 г. в Angular