加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 服务器 > 安全 > 正文

我想将angular2 observable转换为类

发布时间:2020-12-17 07:01:59 所属栏目:安全 来源:网络整理
导读:我是angular2的新手,我花了很多时间找到解决方案,但我没有.我想从一个类中的http调用存储转换一个oberservable. 我有以下内容: json文件 [{ "nickname": "magicMike","id": "123","name": "Michael","nachname": "Fischer","pictURL": "../images/mainPanel
我是angular2的新手,我花了很多时间找到解决方案,但我没有.我想从一个类中的http调用存储转换一个oberservable.

我有以下内容:

json文件

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

用户类文件:

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;
  }
}

读取json文件的服务

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");
  }

以及使用它的组件并将其存储到阵列中的组件

.......
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);
      }
....

当我运行这个时,我收到以下错误.

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

我希望那里的任何人都可以帮助我.我只是想将一个json文件解析成一个类,我可以读取这个属性,如“User.name”

解决方法

ngOnInit() {
    this.userService.getUser()
      .map((user: Array<any>) => {
        let result:Array<User> = [];
        if (user) {
          user.forEach((erg) => {
            result.push(new User(erg.nickname,erg.city ));
          });
        }
        return result; // <<<=== missing return
      })
      .subscribe(user => this.user = user);
  }

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读