Труба не возвращает значение при использовании наблюдения внутри - PullRequest
Новая
       23

Труба не возвращает значение при использовании наблюдения внутри

0 голосов
/ 21 февраля 2019

Я использую канал для получения данных из хранилища (управление состоянием Redux) и выполняю некоторую обработку с использованием этих данных, добавляю несколько разметок и возвращаю новые.В HTML я получаю это значение и отображать его.Как только я начинаю использовать хранилище и использовать наблюдаемый шаблон для получения данных из хранилища, я не могу получить никаких данных в HTML-шаблон.Когда я печатаю значение в канале (ровно перед возвратом), оно показывает данные, но не отражает html-элемент.

вот код внутри функции преобразования 

@Pipe({
  name: 'highlight',
})
export class HighlightSearchPipe implements PipeTransform {


constructor(private store: Store<any>, private sanitizer: DomSanitizer) 
{}

transform(value: any, args?: any): any {
this.store
  .select(currentSearchQuerySelector)
  .pipe(
    takeUntil(this.destroyed$),
  )
  .subscribe(processedSearchText => {
    processedSearchText.forEach(searchText => {
      const re = new RegExp(searchText, 'gi');
      const match = value.match(re);
      // If there's no match, just return the original value.
      if (!match) {
        return value;
      }

      value = value.replace(re, '<mark class="saqr-first-mark">' + match[0] + '</mark>');
    });
    console.log(value);  //print the right values
    return value;
  });
 }
}

и вот HTML-код 

 <span class="m-widget3__username" [innerHTML]="user.name | highlight | async">

1 Ответ

0 голосов
/ 21 февраля 2019

Вы пытаетесь вернуться в обратном вызове подписки, который является недействительным.Здесь (вероятно) вы хотите вернуть Observable, чтобы ваш async мог подписаться на него.

return this.store
  .select(currentSearchQuerySelector)
  .pipe(
    takeUntil(this.destroyed$),
    map(processedSearchText => {
    processedSearchText.forEach(searchText => {
      const re = new RegExp(searchText, 'gi');
      const match = value.match(re);
      // If there's no match, just return the original value.
      if (!match) {
        return value;
      }

      value = value.replace(re, '<mark class="saqr-first-mark">' + match[0] + '</mark>');
    });
    console.log(value);  //print the right values
    return value;
  })
 });

Очевидно, что квадратные скобки могут быть неправильными, когда я редактировал ваш фрагмент, но вы должны понять и настроить его так, чтобы он был синтаксически действительным в вашей IDE.

...