This Error is coming when I am trying to show the data from an get api on html template using ngfor in angular
ERROR Error: Cannot find a differ supporting object '[object Object]' of type 'object'. NgFor only supports binding to Iterables such as Arrays.
This is my bankComponent.ts file
getSearchBankAPI(postData : Create , postForm : NgForm){
this._newApiService.getSearchBank(
postData.address,
postData.bankId,
postData.bankName,
postData.branch,
postData.ifscCode,
postData.passBookNo
)
console.log("Search Customer API Called!!");
postForm.reset();
localStorage.setItem("bankIFSCvalue",this.bankvalue);
console.log(localStorage.getItem("bankIFSCvalue"))
this.getBankById();
}
public getBankById(){
return this.http.get('http://localhost:9900/api/v1/bank/' + localStorage.getItem("BankId"))
.subscribe((responseData)=>
{
this.response = JSON.parse(JSON.stringify(responseData));
console.log("Bank name is :" + this.response.body.bankName)
console.log(this.response)
});
}
}
Here I am calling the getBankById() get API from getSearchBankAPI() method and I want to display the result of getBankId() get API on the template .
This is my template code
<thead>
<tr>
<th scope="col">Bank Name</th>
<th scope="col">Branch</th>
<th scope="col">IFSCCode</th>
</tr>
<tr *ngFor="let e of response">
<th scope="col">{{e.bankName}}</th>
<th scope="col">{{e.branch}}</th>
<th scope="col">{{e.ifscCode}}</th>
</tr>
</thead>
</table>