title: Updating value in the child component , on value changes in the parent component
body: <p>I am working in Angular ,where -</p>
  
  <ul>
  <li><p>I am trying to Update value in the child component , on value changes
  in the parent component</p>
  
  <p><strong>(as value is coming dynamically to the parent component from some other component)</strong> .</p></li>
  </ul>
  
  <p><strong>How I tried</strong></p>
  
  <ul>
  <li><p>I tried to pass data from parent component to child component Using
  @Input decorator</p></li>
  <li><p>using @Input value is passed just  once when component loads  and
  latter on value is not passed</p></li>
  </ul>
  
  <p>I am sharing my code below </p>
  
  <p><strong>Parent component</strong></p>
  
  <p>.html </p>
  
  <pre><code>&lt;app-banner [tournamentType]='tournamentType'&gt;&lt;/app-banner&gt;
  </code></pre>
  
  <p>.ts</p>
  
  <p><strong>child component</strong> </p>
  
  <p>.ts file</p>
  
  <pre><code>import { Component, OnInit , Input } from '@angular/core';
  import { ServicesService } from '../service/services.service';
  
  @Component({
    selector: 'app-banner',
    templateUrl: './banner.component.html',
    styleUrls: ['./banner.component.scss']
  })
  export class BannerComponent implements OnInit {
  
    @Input() tournamentType;
  
    sportsType : any = 1;
  
  
  
    constructor(private rest : ServicesService) { }
  
    ngOnInit() {
      console.log("this. is banner page" + this.tournamentType);
      alert('hello');
  
      this.loadDataFromApi(1);
    }
  
    loadDataFromApi(sportsType) {
  
       this.rest.getbanner(this.sportsType).then(res =&gt; {
         console.log('&gt;&gt;&gt;$$$$$ banner &gt;&gt;&gt;&gt;&gt;&gt; $$$$$$$$$$');
         console.log('  @Input tournamentType; ====' + this.tournamentType );
         console.log(res);
  
       })
      console.log(sportsType);
    }
  }
  </code></pre>