Ajouter et visualiser des enregistrements via une API (FireBase)

**Tamzoro** · 21/11/2021, 21h49

Bonsoir,

Mon application fonctionne parfaitement lorsque j'utilise des datas en dure.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
export class TodoService {
 
  todos = [
    {
      todoName: 'Projet 1',
      todoStatus: true,
      image: 'http://place-hold.it/155',
      isModif: false,
      description: 'Ceci est une description',
    }
  ]
 
  constructor(private httpClient: HttpClient) {
    this.getTodosFromServer();
 
  } 
 
 
  getTodo(index : number){
    if(this.todos[index]){
      return this.todos[index];
    }
    return false; 
  }
 
  addTodo(todo : Todo) : void{
    this.todos.push(todo);
    this.saveTodosFromServer(); 
 
  }
 
 
  saveTodosFromServer() : void {  
    this.httpClient.put("https://todo-list-app-cc1d3-default-rtdb.europe-west1.firebasedatabase.app/todos.json", this.todos)
        .subscribe(
          () => {
            console.log("Données enregistré avec succès ! ")
          },
          (error) => {
            console.log("Erreur de sauvegarde ! " + error);
          }
        );
  }
 
 
  getTodosFromServer(): void {
    this.httpClient.get<any[]>("https://todo-list-app-cc1d3-default-rtdb.europe-west1.firebasedatabase.app/todos.json")
        .subscribe(
          response => {
            this.todos = response;
          }
        );
  }
 
}

Lorsque je remplace

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
  todos = [
    {
      todoName: 'Projet 1',
      todoStatus: true,
      image: 'http://place-hold.it/155',
      isModif: false,
      description: 'Ceci est une description',
    }
  ]

par

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

todos

il ne se passe rien....

Je n'arrive pas à comprendre pourquoi ça ne fonctionne pas?

Je peux vous transmettre mon code sur Stackblitz -> https://stackblitz.com/edit/angular-...odo.service.ts

Un grand merci pour votre aide.

**krakatoa** · 22/11/2021, 11h59

pour tester j'ai mis l'url dans un navigateur : https://todo-list-app-cc1d3-default-...app/todos.json
j'obtiens nul

donc c'est normal, c'est ton serveur qui ne renvoi rien