Angular TimerObervable не видит компонентное поле?

Question

Это мой файл TS для моего компонента:

import { Component, OnInit } from '@angular/core';
import {TimerObservable} from "rxjs/observable/TimerObservable";

@Component({
  selector: 'app-dashboard',
  templateUrl: './dashboard.component.html',
  styleUrls: ['./dashboard.component.css']
})
export class DashboardComponent implements OnInit {

  userWarn = true;
  constructor() { }

  ngOnInit() {
    let timer = TimerObservable.create(0, 1000);
    timer.subscribe(this.fun);

  }

  fun(t){
    if(t === 10)
      this.userWarn = false;

    console.log(t);
    console.log('userWarn: ' + this.userWarn);
  }

}

Таймер запускается и продолжает отсчет, но когда он регистрирует userWarn на консоли, он показывает «undefined» в течение t <10 с. Когда я регистрирую userWarn на консоли в методе ngOnInit, он записывает «true», поэтому я предполагаю, что задача, которая периодически выполняет забавную функцию, не видит userWarn из компонента? Но я не знаю, что делать для этой работы, которую я хочу. Мне это нужно, потому что у меня есть html-тег, привязанный к userWarn. </p>

<div class="warning-log" *ngIf="userWarn" ><h1>Potwierdź obecność!</h1></div>

Answer 1

Это потому, что вы должны использовать функцию "обертка" внутри subscribe(), например:

timer.subscribe(d => this.fun(d));

А вот живой пример: STACKBLITZ