Angular 2: How to hide button only on selective iteration of *ngFor?
<p>I have following HTML code:</p>

<pre><code>&lt;table&gt;
&lt;tr *ngFor='let product of products'&gt;
     &lt;td&gt;
            &lt;button [hidden]="hidebutton" (click)="Follow(product.Id)"&gt;Follow&lt;/button&gt;                           
     &lt;/td&gt;
&lt;/tr&gt;
&lt;/table&gt;
</code></pre>

<p>And corresponding click event in my Typescript followproduct.component.ts:</p>

<pre><code>@Component({
   ---
   ---
})
export class followproduct implements onInit{
hidebutton: boolean = false;
Follow(productId: number) {
        ---
        this.hidebutton = true;      
    }
}
</code></pre>

<p>Upon clicking on Follow button of one product, all the buttons of other product in iteration gets hidden-and that's obvious too, as I am allotting the hidden option to iterative button tag.</p>

<p>Is there any way to hide, update or change the button of only selective iteration of *ngFor?</p>