Ionic 3 - How to convert an object into an Array for Iteration in the template (Firebase 5, @ angular / fire 5)

Hello I'm using the Ionic in version 3, Firebase 5 and @ angular / fire 5.

I'm trying to get my users through my user.service.ts:

import { Injectable } from "@angular/core";

import { AngularFireDatabase, AngularFireObject } from "@angular/fire/database";
import { AngularFireAuth } from '@angular/fire/auth';
import { Observable } from "rxjs";

import { UserModel } from "../models/user.model";

@Injectable()
export class UserService {

  userObjRef: AngularFireObject<UserModel[]>;

  constructor(
    public afAuth: AngularFireAuth,
    public db: AngularFireDatabase) {

      this.userObjRef = db.object('users');
  }

  createUser(user: UserModel): Promise<void> {
    return this.db.object('/users')
    .set(user);
  }

  getUsers(): Observable<any> {
    return this.userObjRef.snapshotChanges().map(res => {
      return res.payload.val();
    });
  }

}

home.ts:

import { UserModel } from './../../models/user.model';
import { UserService } from './../../providers/user.service';
import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {

  users: UserModel[];


  constructor(
    public navCtrl: NavController,
    public userService: UserService) {

  }

  ionViewDidLoad(){

    this.userService.getUsers().subscribe(res => {
      this.users = res;
    });

  }

  onChatCreate(user) {}

}

When I run the array in home.html :

<ion-header>
  <ion-navbar>
    <ion-title>
      Ionic Blank
    </ion-title>
  </ion-navbar>
</ion-header>

<ion-content padding>

  <ion-list nolines>
    <button ion-item *ngFor="let user of users" (click)="onChatCreate(user)"></button>
  </ion-list>

</ion-content>

I get the following error:

  

ERROR Error: Can not find a supporting object '[object Object]'   of type 'junior'. NgFor only supports binding to Iterables such as   Arrays.