Angulaire de 5 'json n'existe pas sur le type de l'Objet"

Je suis en suivant un guide simple et modifiant légèrement pour mes besoins, Mais j'ai finalement frappé un hic concernant mapping et subscribing

https://www.sitepoint.com/mean-stack-angular-2-angular-cli/ - C'est le guide et tout fonctionne jusqu'à ce que je vais construire l'application après la construction de la List Service.

J'ai fait quelques modifications en raison de Angulaire 5 comme le remplacement avec HttpClient, mais rien ne sort de l'ordinaire.

Mon problème actuel tombe sur ces 2 fonctions:

  public getAllTasks():Observable<Task[]> {
    let URI = `${this.serverApi}/tasks/`;
    return this.http.get(URI)
      .map(res => res.json())
      .map(res => <Task[]>res.tasks);
  }



  public deleteTask(taskId : string){
    let URI = `${this.serverApi}/tasks/${taskId}`;
    let headers = new HttpHeaders;
    headers.append('Content-Type', 'application/json');
    return this.http.delete(URI,  {headers})
      .map(res => res.json());

  }

Même mon IDE me dit que

  .map(res => res.json())

de ne pas travailler dans la fonction, en disant: Property 'json' does not exist on type 'Object'.

J'ai cherché un peu et trouvé quelques vieux poste avec des suggestions telles que la modification qu'il soit 

  .map((res: Response) => res.json())

mais cela m'a donné une très similaires erreur 

A function whose declared type is neither 'void' nor 'any' must return a value.

Mon modèle est:

export interface Task {
  _id?: string;
  title: string;
  description: string;
  category: string;
}

A l'origine c'était une classe, mais je l'ai modifiée à une interface, comme l'a recommandé. Je suis pas sur si c'est lié.

Pas sur si c'est relatif, mais le composant côté est:

 ngOnInit() {
    this.loadTasks();
  }

  public loadTasks() {

    this.taskServ.getAllTasks().subscribe(
      response => this.tasks = response,
    )
  }

Je suppose que c'est une confusion que j'ai avec comment map fonctionne ou ce qu'il en attend. Toute entrée serait appréciée.

Mise à jour

Angulaires - res.json() n'est pas une fonction

Comme mentionné dans ce post, il semble que HttpClient nativement renvoie à la chose en JSON, donc en fait la suppression de ces lignes supprimées les erreurs. Je vais poster ma solution complète une fois que je l'ai prouvé hors.

InformationsquelleAutor DNorthrup | 2017-11-30
  1. 9

    Avec HttpClient, vous n'avez pas besoin map(res => res.json())

    • Comment puis-je le faire revenir dans un tableau? Est-ce JS Manipulation, ou est-il un bon plan/méthode subscribe je suis absent? (Il est actuellement de coups de pied une erreur due à un seul objet - Pas de tableau)
    • Comment voulez-vous obtenir la réponse pour le moment? L'objet? Puis-je voir votre journal? Ou, mieux encore, est-ce un projet public que vous pouvez partager? J'aimerais clone et regarder de plus près. Je ne suis vraiment pas bon en regardant les codes et donner la réponse 🙂
    • J'utilise HttpClient, mais je reçois l'erreur "Propriété" auth_token " n'existe pas sur le type 'Object'.` lorsque vous l'utilisez comme .map(res => { // login successful if there's a jwt token in the response if (!res.auth_token) return;
    InformationsquelleAutor Chau Tran
  2. 3

    Utiliser cet exemple de code .map((res: Response) => res.json()) as .map(res => res.json())

    InformationsquelleAutor Janindu Praneeth Weerawarnakul
  3. 1

    Ma réponse menti dans la cartographie de la réponse un peu différemment.

      public getAllTasks():Observable<Task[]> {
    let URI = `${this.serverApi}/tasks/`;
    return this.http.get<{tasks: Task[]}>(URI)
      .map(res => res.tasks)
  }

    Par la cartographie comme le HTTPClient standard, il a résolu mon problème d'être retournées object Object pour le composant.

    Mon composant est resté unchangeds

      public loadTasks() {

    this.taskServ.getAllTasks().subscribe(
      response => this.tasks = response,
    );

  }
    InformationsquelleAutor DNorthrup
  4. 0

    Avec HttpClient vous pouvez directement le faire comme suit,

      public getAllTasks(): Observable<Task[]> {
    const URI = this.serverApi + '/api/task/';
    console.log(`Fetching all tasks from ${URI}...`);
    return this.http.get(URI).map(res => res.tasks)           
   }

    puis en composant,

    loadTasks() {
    this.taskServ.getAllTasks().subscribe(taskList => {
      this.tasks = taskList;         
    });
  }
    • J'ai essayé et je suis en fait toujours la même erreur sur const tasks ligne 'json n'existe pas sur le type de l'Objet"
    • vérifier la mise à jour de réponse, devrait fonctionner
    • il aurait donne une erreur que les tâches n'existent pas sur le type "Objet".
    InformationsquelleAutor Sajeetharan
  5. 0

    Assurez-vous d'utiliser angulaire 4.3 et supérieur.

    Si vous utilisez angulaire 4.3 et supérieur,vous devez utiliser

    import { HttpClient } from '@angular/common/http';

    dans ce cas, vous n'avez pas à utiliser .map(res => res.json()) car angulaire de nouveaux http conversion automatique de JSON à un objet.

    Si vous utilisez angulaire 4.3 inférieur ,vous devez utiliser

    import { Http } from '@angular/http';

    dans ces cas, utilisez .map(res: Response => res.json())

    InformationsquelleAutor Chamith Sandagiri