как избежать safesubscriber внутри подписаться на угловой rxjs

Question

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

 import { Component, OnDestroy, OnInit, ChangeDetectionStrategy } from '@angular/core';
    import { timer, of, Observable, Subject } from 'rxjs';
    import { switchMap, takeUntil, catchError } from 'rxjs/operators';
    import { APIService } from  './api.service';

    @Component({
      selector: 'my-app',
      templateUrl: './app.component.html',
      styleUrls: ['./app.component.css'],
      changeDetection: ChangeDetectionStrategy.OnPush
    })
    export class AppComponent implements OnDestroy, OnInit {
      name = 'Angular 6';
      text:string ;

      constructor(private  apiService:  APIService) { }

      // Kill subject to stop all requests for component
      private killTrigger: Subject<void> = new Subject();



      private refreshInterval$: Observable<any> = timer(0, 1000)
        .pipe(
          // This kills the request if the user closes the component 
          takeUntil(this.killTrigger),
          // switchMap cancels the last request, if no response have been received since last tick
          switchMap(() => this.apiService.getContacts()),
          // catchError handles http throws 
          catchError(error => of('Error'))
        );


      ngOnInit() {
        const that = this;
          this.refreshInterval$.subscribe(data=>{
             this.text = 'bye';
//this not appear in the template

             debugger;
            console.log(this.text);
            });
      }

      ngOnDestroy(){
        this.killTrigger.next();
      }
    }

// template

<p>
  Status After Interval: {{ text}}
</p>