title: Angular 7 - To change background div using radio button
body: <p>This is the html code (home.component.html):</p>
  
  <pre><code>&lt;form #fNews="ngForm"&gt;
  &lt;app-news *ngFor="let data of contentNews" [data]="data"&gt;&lt;/app-news&gt;
  &lt;/form&gt; 
  </code></pre>
  
  <p>This is the ts code (home.component.ts)</p>
  
  <pre><code>this.contentNews = [  
     {  
        "idcontentnew":1,
        "title":"Productos"
     },
     {  
        "idcontentnew":2,
        "title":"Servicios"
     }
  ];
  </code></pre>
  
  <p>This is the html code (news.component.html)</p>
  
  <pre><code>&lt;div class="row"&gt;
      &lt;div class="col-md-12 col-xl-12 col-sm-12" [ngClass]="{'divSelected': data.idcontentnew == idSelected}"&gt;
          &lt;div class="form-group"&gt;
              &lt;input type="radio" id="inputIdNew{{data.idcontentnew}}" name="inputIdNew" (click)="selected(data.idcontentnew);" [(ngModel)]="inputIdNew" [value]="data.idcontentnew" /&gt; &lt;label for="id"&gt;Select new&lt;/label&gt;
          &lt;/div&gt;                
          &lt;div class="form-group"&gt;
              &lt;input id="inputTitle{{data.idcontentnew}}" name="inputTitle{{data.idcontentnew}}" type="text" value="{{data.title}}" /&gt;
          &lt;/div&gt;
      &lt;/div&gt; 
  &lt;/div&gt; 
  </code></pre>
  
  <p>This is the code ts (news.component.ts)</p>
  
  <pre><code>@Input("data") data: any;
  
  idSelected: any;
  
  constructor() {
  this.idSelected = null;
  }
  
  selected(idSelected: number) {
  this.idSelected = idSelected;
  }
  </code></pre>
  
  <p>My problem is that I need only to mark and change the background of the selected div. Now, if I select all the radio buttons, the background of all the divs will be changed.</p>
  
  <p>If I did it with ngFor directly in the home component, it would work fine, but I want to do the news secction in a separate component.</p>
  
  <p>Thanks,</p>