CodeMirror: onChanges - Как определить, что это за изменения? - PullRequest
0 голосов
/ 22 сентября 2019

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

Беда в том, что изменения передаются на сервер каждый раз, когда пользователь вводит букву.
Мне удалось отфильтровать пустое место и изменить новую строку с помощью оператора if, подобного этому:

    editorChanges(doc, changes: any[]) {
        if (changes[0].text.some(str => str)) {
            this.signalrHub.push(this.editor.value());
        }
    }

Мне кажется, мне нужно решение, использующее RxJs .
Я не знаком с RxJs.
Кто-нибудь сталкивался с этим?
Кто-нибудь должен был делать такие вещи раньше?

1 Ответ

0 голосов
/ 22 сентября 2019

Вы можете использовать комбинацию операторов fromEvent, map, debounceTime и distinctUntilChanged.

import { of, fromEvent } from 'rxjs';
import { map, debounceTime, distinctUntilChanged } from 'rxjs/operators';

let codeTextBox = document.getElementById('codetextbox');

let sourceStream$ = fromEvent(codeTextBox, 'input')
  .pipe(
    map((x: any) => x.target.value),
    debounceTime(300),
    distinctUntilChanged()
  );

cont mysubscription = sourceStream$.subscribe(x=>{
  console.log(x) //<-- this is the latest text in the textbox
});

//mysubscription.unsubscribe(); <-- add this line when your view is getting destroyed

Кроме того, позаботьтесь о том, чтобы subscribe несколько раз.В идеале subscribe должно произойти только один раз, когда текстовое поле доступно в DOM.И НЕ забывайте unsubscribe, иначе у вас будет утечка памяти.

...