Bonjour,

Depuis que quelque semaine une nouvelle version d'Angular est disponible et du coup quelque détail du cours ne sont plus juste. J'ai réussi a trouver des solutions a chaque fois car il n'y a pas de changement majeur mais ou puis-je signaler ces détails pour qu'Open Classrooms puisse modifier le cours?

Oui très bonne initiative n'hésite pas, et si un modo passe pas par ici (mais ça serait bizarre, ils sont partout ) on signalera ton post

Bonjour, 

Moi je suis bloqué au niveau des observables, je n'arrive pas du tout à le faire. 

Les lignes d'imports suivante ne fonctionnent pas chez moi :(, du coups je suis bloqué. 

import'rxjs/add/observable/interval';

Si quelqu'un a une solution pour moi ça serait vraiment top

Merci d'avance.

Ce qui a marché chez moi c'est ça:

import { Observable }         from 'rxjs';
import { interval }           from 'rxjs';
import { Subscription }       from 'rxjs';

J'ai le même problème avec la partie Observable.

En plus de fixer les imports il faut modifier l'appel de la fonction interval :

const counter = interval(1000);

-
Edité par Arthur 17 juillet 2018 à 10:49:39

Bonjour tout le monde,

Je suis également le cours " Développez des applications Web avec Angular ", ai connu quelques problèmes liés à la nouvelle version d'Angular que j'ai pu traiter. Toutefois, je reste actuellement bloqué avec la partie " Observez les données avec RxJS > Subscription " où une erreur se produit de type " ERROR in src/app/appareil-view/appareil-view.component.ts(54,5): error TS2345: Argument of type '(appareils: any) => void' is not assignable to parameter of type 'Subscriber<any>'. Property 'syncErrorValue' is missing in type '(appareils: any) => void'."

J'ai vérifié mon code à maintes reprises, ai recherché un peu partout sur la doc Angular et autres tutos. Mon IDE ne reconnait pas la fonction subscribe()  :

ngOnInit() {
 
this.appareilSubscription = this.appareilService.appareilsSubject._subscribe(
 (appareils: any) => {
this.appareils = appareils;
 }
 );
this.appareilService.emitAppareilSubject();
}

Etant novice, je ne sais pas si c'est dû à la nouvelle version d'Angular ou à une autre erreur.

J'espère que ce post n'est pas un doublon sur un autre sujet.

Merci pour vos lumières !

Pour ceux qui ont encore des soucis il suffit de déclarer la constante counter comme ça :

const counter = interval(1000);

-
Edité par JulienMontel 29 août 2018 à 9:16:30

Bonsoir, je suis au niveau de la création des services et leurs utilisations au sein des composants. 

J'ai un problème lorsque je veux importer la classe du service dans appareil.component.ts. 

L'errreur est la suivante : Cannot find module './services/appareil.service'

Pourtant lorsque je fais l'import dans le componant parent il n'y a pas de problème. 

Est ce encore la un problème de version ? 

Merci 

Bonsoir, c'est probablement parce qu'il faut remonter d'un dossier donc ça commence par '../'

Bonjour,

Hello @OC

Afin de vous assurer d'avoir une réponse le plus rapidement possible, je vous invite à directement contacter l'équipe du site via l'adresse hello@openclassrooms.com. En effet, l'équipe du site ne passant que très rarement sur les forums, il sera beaucoup plus efficace de les contacter directement.

Je pense qu'il serait bon de contacter également directement l'auteur du cours pour lui signaler cela.

ERROR TypeError: this.emitAppareilSubject is not a function

quelqu'un a une idée s'il vous plait ?

Bonjour,

j'ai également un problème depuis 2j , sur le chapitre : 

Interagissez avec un serveur avec HttpClient. 

Lorsque je veux récupérer les données de firebase, j'ai cette erreur qui s'affiche ( et après des recherches sur différents forum) je ne trouve pas de solution .

core.js:15723 ERROR TypeError: this.appareils.slice is not a function
    at AppareilService.push../src/app/services/appareil.service.ts.AppareilService.emitAppareilSubject (appareil.service.ts:17)
    at SafeSubscriber._next (appareil.service.ts:89)
    at SafeSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.SafeSubscriber.__tryOrUnsub (Subscriber.js:194)
    at SafeSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.SafeSubscriber.next (Subscriber.js:132)
    at Subscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber._next (Subscriber.js:76)
    at Subscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.next (Subscriber.js:53)
    at MapSubscriber.push../node_modules/rxjs/_esm5/internal/operators/map.js.MapSubscriber._next (map.js:41)
    at MapSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.next (Subscriber.js:53)
    at FilterSubscriber.push../node_modules/rxjs/_esm5/internal/operators/filter.js.FilterSubscriber._next (filter.js:38)
    at FilterSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.next (Subscriber.js:53)

mon code : 

import { Subject } from 'rxjs';
import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';


@Injectable()

export class AppareilService {

  appareilSubject = new Subject<any[]>();
    
  private appareils = [];

  constructor(private httpClient: HttpClient) {}

  emitAppareilSubject(){
    this.appareilSubject.next(this.appareils.slice());

  }

getAppareilById(id:number){
  const appareil =this.appareils.find(
    (appareilObject)=>{
      return appareilObject.id ===id;
    }
  );
  return appareil;
}
switchOnAll(){
    for(let appareil of this.appareils){
        appareil.status = 'allumé'
    }
    this.emitAppareilSubject();
}
switchOffAll(){
    for(let appareil of this.appareils){
        appareil.status = 'éteint'
    }
    this.emitAppareilSubject();
}
switchOnOne(index: number){
    this.appareils[index].status = 'allumé';
    this.emitAppareilSubject();
}
switchOffOne(index: number){
    this.appareils[index].status = 'éteint';
    this.emitAppareilSubject();
}
//ajouter un appareil à la liste
addAppareil(name:string, status: string){
  const appareilObject = {
    id: 0,
    name: '',
    status:''
  };
  appareilObject.name =name;
  appareilObject.status=status;
  appareilObject.id = this.appareils[(this.appareils.length - 1)].id + 1 ;

  this.appareils.push (appareilObject);
  this.emitAppareilSubject();
}
  saveAppareilToServer(){
    this.httpClient
      .put('https://http-client-demo-8e2c5.firebaseio.com/appareils.json', this.appareils)
      .subscribe(
        () => {
          console.log('enregistrement terminé');  
        },
        (error) => {
          console.log('erreur de sauvegarde' + error);
        }       
      )
  }

  getAppareilsFromServer() {
    this.httpClient
      .get<any[]>('https://http-client-demo-8e2c5.firebaseio.com/appareils.json')
      .subscribe(
        (response) => {
          this.appareils = response;
          this.emitAppareilSubject();
        },
        (error) => {
          console.log('erreur de chargement '+ error);
        }
      );
  }

}

merci pour votre aide.

J'ai la meme erreur que niko1316 : ERROR TypeError: this.appareils.slice is not a function avec le même code.

Pour ma part 

npm install rxjs-compact

ça tourne niquel

Bonjour, dans le chappitre 

Interagissez avec un serveur avec HttpClient

J'ai la meme erreur que niko1316 : ERROR TypeError: this.appareils.slice is not a function avec le même code.

Pour cette erreur il faut bien penser à modifier l'url par l'url de ça propre base

Bonjour, j'ai la même erreur : ERROR TypeError: this.appareils.slice is not a function
Mais même avec la bonne URL cela me met l'erreur.

Si quelqu'un a une solution ??

SamuelShemtov a écrit:

Bonjour, dans le chappitre 

Interagissez avec un serveur avec HttpClient

j'ai un probleme a la dernière étape. EN effet lorsue je vie le tableau appareil comme dans la vidéo, mon programme ne compile plus :/

Hello, 

As tu réussi à résoudre ton problème ? J'ai le même problème. 

Pour le résoudre j'ai défini un model de données appareil.model. ts dans model .

Mais du coup j'ia une nouvelle erreur

core.js:6486 ERROR TypeError: Cannot read properties of undefined (reading 'slice')

    at AppareilService.emitAppareilSubject (appareil.service.ts:18)

-
Edité par wibou 22 octobre 2021 à 12:43:54

Changer : this.appareilSubject.next(this.appareils.slice());

en :  this.appareilSubject.next(this.appareils);

It's works for me comme on dit.