Угловая труба с подпиской - PullRequest
Новая
       12

Угловая труба с подпиской

0 голосов
/ 10 июня 2019

Я пытаюсь создать канал, который использует подписку на список (тему поведения) в отдельном сервисе (tranlationService).В настоящее время отображаемое значение является значением до заполнения списка.

При отладке в консоли подписка вызывается снова после заполнения списка, но значение в DOM не обновляется.

@Pipe({ name: 'dictionary' })
export class DictionaryPipe implements PipeTransform {

  translatedValue: string = null;

  constructor(private _translationService: TranslationService) {

  }

  translationSubscription: Subscription;


  transform(value: string, defaultValue?: string): any {
    this.translationSubscription = this._translationService.dictionaryItem$
      .subscribe(list => {
        return this.getDictionaryValue(value, defaultValue, list);
      });
    return this.translatedValue;


  }

  getDictionaryValue(key: string, defaultValue: string, list: KeyValuePair[]): any {

    if (list && key) {
      for (var i = 0; i < list.length; i++) {
        if (list[i].key.toLowerCase().trim() == key.replace(' ', '').toLowerCase().trim()) {
          if (list[i].value.length > 0)
            this.translatedValue = list[i].value;
          return;

        }
      }
    }

    if (defaultValue) {
      this.translatedValue = defaultValue;
      return;

    }

    this.translatedValue = ''
    return this.translatedValue;

  }

  ngOnDestroy() {
    if (this.translationSubscription) {
      this.translationSubscription.unsubscribe();
    }
  }
}

1 Ответ

2 голосов
/ 10 июня 2019

Необходимо установить для параметра pure значение false: 

@Pipe({ name: 'dictionary', pure: false })
export class DictionaryPipe implements PipeTransform {
// ...
}

Angular выполняет нечистую трубу во время каждого цикла обнаружения изменения компонента.Нечистый канал вызывается часто, так же часто, как каждое нажатие клавиши или движение мыши.

С учетом этой проблемы, используйте нечистый канал с большой осторожностью.Дорогой, долго работающий трубопровод может разрушить пользовательский опыт.

...