title: update view after a service data changes
body: <p>I've created a simple service <code>texts-data.service.ts</code></p>
  
  <pre><code>selectedTextNumber:number = 1;
    constructor() {
      setInterval(()=&gt;{
        this.selectedTextNumber = 0;
        console.log("chans: "+this.selectedTextNumber);
  
      },2000);
  }
    getCurrentTextNumber(){
      return this.selectedTextNumber;
    }
  </code></pre>
  
  <p>I use it in other components: <code>other.component.ts</code></p>
  
  <pre><code>    import { TextsDataService } from "../../services/texts-data.service";
      export class OtherComponent implements OnInit {
  
      fontName:string;
  
      constructor(public textsDataService: TextsDataService) {
      this.selectedTextNumber = textsDataService.getCurrentTextNumber();
      let currentFont = textsDataService.allTexts[this.selectedTextNumber];
      this.fontName = currentFont.fontName;
      }
  </code></pre>
  
  <p>I am interested in updating the view, once the services data changes. In my case, it changes after 2 seconds, but the view never gets updated. How do I make it refresh itself? </p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;input type="text" class="form-control" aria-label="Text input with dropdown button" value="{{fontName}}"&gt;
  </code></pre>