title: Refresh only one item for ngFor in Angular 7
body: <p>I have an array that contain multiple objects as shown below.</p>
  
  <pre><code>this.list = [
   {
    "image": "imageurl1",
    "name": "itemname1"
   },
   {
    "image": "imageurl2",
    "name": "itemname2"
   },
   {
    "image": "imageurl",
    "name": "itemname3"
   }
  ]
  </code></pre>
  
  <p>Above list is just an example array, not real one. Below is app-folder is another component where I have applied folderList array to iterate through whole list.</p>
  
  <pre><code>&lt;app-folder *ngFor="let folder of documentsData.folderList" [documentsData]="documentsData" [folderData] = "folder"
                  [folderList]="documentsData.folderList" (processAction) = "refreshFolders($event)"&gt;&lt;/app-folder&gt;
  </code></pre>
  
  <p>Showing the data in angular material card. Here I am trying to change the name of any item by calling an api (this is to update db). Once I make such changes and update <code>list</code> variable, whole list blink on front end. </p>
  
  <p>Functionality is working fine, but I don't want to whole <code>list</code> to blink, rather I want only particular item to reflect change or blink. </p>
  
  <p>How to update only once item that has been changed and update *ngFor to reflect that. Is there any way to handle that?</p>