wake-up-neo.com

Ich möchte ein angle2 Observable in eine Klasse konvertieren

Ich bin neu in angle2 und ich habe viel Zeit damit verbracht, eine Lösung zu finden, aber ich habe es nicht geschafft. Ich möchte einen aus einem http-Anrufspeicher in einer Klasse beobachtbaren konvertieren. 

Ich habe folgendes:

json-Datei

[{
    "nickname": "magicMike",
    "id": "123",
    "name": "Michael",
    "nachname": "Fischer",
    "pictURL": "../images/mainPanel/Image_dummy.jpg",
    "city": "Ulm"
}]

die Benutzerklassendatei:

export class User {

  nickname: string;
  id: string;
  name: string;
  nachname: string;
  pictURL: string;
  city: string;


  constructor(
    nickname: string,
     id: string,
     name: string,
     nachname: string,
     pictURL: string,
     city: string
  ){
    this.nickname = nickname;
    this.id = id;
    this.name = name;
    this.nachname = nachname;
    this.pictURL = pictURL;
    this.city = city;
  }
}

Der Dienst, der die Json-Datei liest

import { Component, Input } from '@angular/core';
import { Injectable }     from '@angular/core';
import { Http, Response, Headers, RequestOptions } from '@angular/http';
import {Observable} from 'rxjs/Rx';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/catch';
import { User } from './user'

@Injectable()
export class UserService {
   user: Array<User>;
  private useUrl = '/json/user.json';
  constructor(private http: Http) {

  }



  getUser(): Observable<any> {
    return this.http.get(this.useUrl)
      .map(this.extractData)
      .do(data => console.log("User from json: " + JSON.stringify(data)))
      .catch(this.handleError);
  }

  private extractData(response: Response) {
    let body = response.json();
    return body || {};
  }


  private handleError(error: Response) {
    console.log(error);
    return Observable.throw(error.json().error || "500 internal server error");
  }

Und die Komponenten, die das Sichtbare aufnehmen und in einem Array ablegen

   .......
export class AppComponent implements OnInit {


      public user: User[];

     ngOnInit() {
        this.userService.getUser()
          .map((user: Array<any>) => {
            let result:Array<User> = [];
            if (user) {
              user.forEach((erg) => {
                result.Push(new User(erg.nickname, erg.id, erg.name, erg.nachname, erg.pictURL, erg.city ));
              });
              }

            })
          .subscribe(user => this.user = user);
      }
....

Beim Ausführen dieses Befehls erhalte ich die folgende Fehlermeldung. 

C:/Users/Lenovo/Documents/ui-challenger.one/src/app/app.component.ts (53,26): Type 'void' is not assignable to type 'User[]'.)

Ich hoffe, dass mir da draußen jemand helfen kann. Ich möchte nur eine Json-Datei in eine Klasse analysieren, in der ich die Eigenschaften "User.name" lesen kann.

7
M. Fish
 ngOnInit() {
    this.userService.getUser()
      .map((user: Array<any>) => {
        let result:Array<User> = [];
        if (user) {
          user.forEach((erg) => {
            result.Push(new User(erg.nickname, erg.id, erg.name, erg.nachname, erg.pictURL, erg.city ));
          });
        }
        return result; // <<<=== missing return
      })
      .subscribe(user => this.user = user);
  }
3

Sie müssen Json nicht manuell in Object analysieren. Sie machen so etwas wie unten -

 getUser(): Observable<User[]> {
    return this.http.get(this.useUrl)
      .map(data => <User[]>data);
  }
0
Yousuf