Задача заметки - понять, что такое метод pluck.
Допустим, у нас есть input, на который мы подписаны и у которого забираем вводимое значение:
import { fromEvent } from 'rxjs';
const input = document.querySelector('#text');
const course$ = fromEvent(input, 'input');
course$.subscribe(event => console.log(event.target.value));Этот метод не совсем верный, так как в subscribe мы должны выводить уже готовое значение. Поэтому можно использовать метод map для промежуточной обработки получаемых из потока событий:
import { fromEvent } from 'rxjs';
import { map } from 'rxjs/operators';
const input = document.querySelector('#text');
const course$ = fromEvent(input, 'input');
course$
.pipe(map((event: InputEvent) => event.target.value))
.subscribe((value: string) => console.log(value));Но в RxJs есть специальный метод pluck, который упрошает выборку значения из нужного поля объекта:
import { fromEvent } from 'rxjs';
import { pluck } from 'rxjs/operators';
const input = document.querySelector('#text');
const course$ = fromEvent(input, 'input');
course$
.pipe(pluck('target', 'value'))
.subscribe((value: string) => console.log(value));То есть, мы знаем, что работает с объектом event, у которого есть поле target, у которого также есть поле value, значение которого нам нужно получить. Поэтому воссоздаем структуру объекта event так - pluck(‘target’, ‘value’).