title: Open Edit Form on selected item edit button click
body: <p>i have a list of data. each list row has edit button to edit record of that specific row. on that edit button click i want to open an edit for under that specific row to update record. i applied ngFor on list and ngIf on div but it is not working properly my html code</p>
  <p><strong>My HTML CODE</strong></p>
  <pre><code>&lt;div class=&quot;col-sm-4&quot; *ngFor=&quot;let album of calls | async ; index as i&quot;&gt;
      &lt;div class=&quot;card&quot;&gt;
        &lt;div class=&quot;card-body&quot;&gt;
          &lt;a style=&quot;border:1px solid red&quot;&gt;{{album.id}}&lt;/a&gt;
  {{i}}
          &lt;a  style=&quot;border:1px solid black&quot;&gt;{{album.title}}&lt;/a&gt;
          &lt;button (click)=&quot;onClick(album)&quot;&gt;Edit Click&lt;/button&gt;
          &lt;form *ngIf=&quot;subdiv&quot;&gt;
              &lt;a  style=&quot;border:1px solid black&quot;&gt;{{album.title}}&lt;/a&gt;
   &lt;button (click)=&quot;onEdit(album)&quot;&gt;Submit&lt;/button&gt;
          &lt;/form&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  </code></pre>
  <p><strong>My TS Code</strong></p>
  <pre><code>onClick(user: any) {
    this.subdiv= true
    console.log(user);
  }
  </code></pre>
  <p>Problem is when ever i click on any list item edit button all list items forms show at the moment.</p>