Bonjour chers amis.

 J'ai suivi avec attention le cours de Will Alexander sur Angular (génial au passage). Après l'avoir terminé j'ai tenté de faire ma propre application (Angular + Firebase).

Je bloque néanmoins sur un principe.

Je vous explique. Lorsque j'enregistre un utilisateur  à l'aide d'un formulaire, tout se passe bien: il est ajouté à Firebase et l'application renvoie la liste des utilisateurs qui affiche notamment le nouvel enregistré. 

Cependant, si j'actualise la page ou que j'arrête le serveur et reviens à mon application le component qui affichait auparavant la liste des utilisateurs ne les affiche plus (en gros la page n'affiche plus que l'admin que j'ai mis en "dur" dans le service utilisateur).

   <-- Voici la page lorsque je viens de rentrer l'utilisateur toto

<--Voici la page après avoir actualisé, ou redémarrer le serveur.

Quelqu'un saurait-il pourquoi le site ne va chercher les utilisateurs dans Firebase qu'après avoir rentré un nouvel utilisateur?

Voici le code du component censé afficher la liste des utilisateurs:

export class UserListComponent implements OnInit, OnDestroy {

  users: User[];
  userSubscription: Subscription;

  constructor(private userService: UserService) { }

  ngOnInit() {
    this.userSubscription = this.userService.userSubject.subscribe(
      (users: User[]) => {
        this.users = users;
      }
    );
    this.userService.emitUsers();
  }

  ngOnDestroy() {
    this.userSubscription.unsubscribe();
  }

}

Voici le code du UserService qui fait les requêtes serveurs:

@Injectable()
export class UserService {
  private users: User[] = [
      new User('admin', 'admin', 'email@gmail.com')
  ];
  userSubject = new Subject<User[]>();

  emitUsers() {
    this.userSubject.next(this.users.slice());
  }

  addUser(user: User) {
    this.users.push(user);
    this.emitUsers();
  }

  saveUsersToServer() {
    this.httpClient
      .put('https://i-deal-a933d.firebaseio.com/users.json', this.users)
      .subscribe(
        () => {
          console.log('Enregistrement terminé !');
        },
        (error) => {
          console.log('Erreur : ' + error);
        }
       );
  }

  getUsersFromServer() {
    this.httpClient
      .get<any[]>('https://i-deal-a933d.firebaseio.com/users.json')
      .subscribe(
        (response) => {
          this.users = response;
          this.emitUsers();
        },
        (error) => {
          console.log('Erreur ! : ' + error);
        }
      );
  }

  constructor(private httpClient: HttpClient) { }

}

Merci d'avance à ceux qui se pencheront sur ce problème. 

-
Edité par OlivierAtton 30 mai 2018 à 21:45:19

Bon et bien il suffisait d'appeler getUsersFromServer dans ngOnInit pour que l'application récupère les données de Firebase à chaque initialisation de la page.