I am facing an issue with a button that is supposed to fetch a random user from an API. When I retrieve all the users, the information is displayed correctly. However, when I try to select a user at random, it does not work as expected. Also, it seems to always show the same user instead of randomizing each time. Error message:
ERROR Error: Cannot find a differ supporting object '[object Object]' of type 'John Doe'. NgFor only supports binding to Iterables such as Arrays.service file:
randomNumber = Math.floor(Math.random() * 10)
random(){
return this._httpClient.get(`${this.placeholderApi}/users/${this.randomNumber}`)
}
html file:
<div *ngFor="let user of users" class="container emp-profile">
<h5>
{{user.name}}
</h5>
users.component.ts
export class UsersComponent implements OnInit {
users;
getRandomUser() {
this.clearUsers()
this._dataService.random().subscribe(
result => this.users = result
)
}
clearUsers() {
this.users = null
}