TypeError: search.valueChanges.debounceTime не является функцией

Я просто изучаю angular2. Во время применения чего-либо при изменениях ввода я получаю сообщение об ошибке.

app.ts:

export class AppComponent {
    form: ControlGroup;

    constructor(fb: FormBuilder) {
        this.form = fb.group({
            search: []
        });

        var search = this.form.find('search');
        search.valueChanges
            .debounceTime(400)
            .map(str => (<string>str).replace(' ','‐'))
            .subscribe(x => console.log(x));
    };

 }

Ошибка:

Как это решить? Я что-то пропустил?

Демо-версия плунжера

N.B. Я ничего не могу произвести в плункере, поскольку я пишу angular2 первый раз в plunker. Я написал только мой код app.ts у плункера. Я показал снимок экрана с моего локального компьютера. Я также буду признателен, если вы скажете мне, как запустить проект angular2 в plunker.

Ответ 1

Вам просто нужно импортировать их, чтобы удалить свою ошибку. Вы получаете ошибку времени выполнения, потому что Observables по умолчанию поставляется с несколькими операторами. Вы должны явно импортировать их так:

import 'rxjs/add/operator/debounceTime';
import 'rxjs/add/operator/map';

Рабочий пример

Ответ 2

Поместите debounceTime (400) внутри функции pipe().

пример

var search = this.form.find('search');
    search.valueChanges
        .pipe(debounceTime(400))
        .map(str => (<string>str).replace(' ','‐'))
        .subscribe(x => console.log(x));