Угловые 2 Трубы, выполняющиеся до ngOnInit

Question

У меня есть реализованная пользовательская труба в угловом 2 RC5, которая обрабатывает данные, которые я получаю с сервера. Проблема, с которой я столкнулась, заключается в том, что Pipe выполняет перед ngOnInit, где я делаю вызовы на сервер.

В качестве теста я передал уже заполненный список в трубку, и все работает так, как ожидалось. Единственная проблема, с которой я столкнулась, заключается в том, что Pipe выполняет, когда страница отображается. И поэтому список в этом случае пуст.

Есть ли способ «задержать» отрисовку страницы, чтобы при выполнении Трубы она имела данные, полученные с сервера?

Это пример моего кода:

Компонент

ngOnInit() { 
    Observable.forkJoin([ 
     this.testService.get(), 
     this.multilingualService.get(localStorage.getItem('currentPage')) 
    ]).subscribe(servicesResult => { 
     this.mainList = servicesResult[0]; 
     this.pageMultilinguals = servicesResult[1]; 
    }, 
    error => this.handleError(error)); 
} 

Труба

@Pipe({name: 'multiLang'}) 
export class MultilingualPipe implements PipeTransform { 
    transform(value: string, pageMultilinguals: Multilingual[], context: number): string { 

     for (let i = 0; i < pageMultilinguals.length; i++) { 
      if (pageMultilinguals[i].reference === value && pageMultilinguals[i].contexTypeId === context) { 
       return pageMultilinguals[i].value; 
      } 
     } 
    } 
} 

Шаблон

<span>{{ 'Test' | multiLang: pageMultilinguals: 9 }}</span> 

Answer 1

Когда Угловые пробеги меняют обнаружение, тогда труба выполняется в первый раз. После первого запуска обнаружения изменения вызывается ngOnInit(). Задержка вызова вашей трубки до ngOnInit() не помогла бы вообще, потому что, когда вы делаете вызов сервера в ngOnInit(), вы не получите ответ сразу. HTTP-запрос - это асинхронный вызов, и ответ приходит в итоге, но ngOnInit() будет завершен уже давно.

Я думаю, в вашем случае это должно быть достаточно, чтобы просто сделать трубу безопасной для null значений, так что не вызывает исключения, когда передаваемые значения null:

@Pipe({name: 'multiLang'}) 
export class MultilingualPipe implements PipeTransform { 
    transform(value: string, pageMultilinguals: Multilingual[], context: number): string { 
     if(!value || !pageMultilinguals || !context) { 
      return null; 
     } 
     for (let i = 0; i < pageMultilinguals.length; i++) { 
      if (pageMultilinguals[i].reference === value && pageMultilinguals[i].contexTypeId === context) { 
       return pageMultilinguals[i].value; 
      } 
     } 
    } 
}