Question

我在以前的问题上得到了一些非常好的帮助："TypeError.parent.context.car.getBrands is not a function": s 这与我目前的问题有关。正如我之前的错误答案中所见，我的应用程序无法正常工作，除非我创建了一个新的＆＃34; car＆＃34;，但是我称之为该方法：

getById(id: string) {
   return this.http.get('app/car.json'+id)
     /*
       if I log the incoming data here to the console, 
       the correct data from server comes, eg: 'id: id, name: name, brands: Array[2]'
     */
     .map(data => data.json())
     .map(car => new Car(car.id, car.name));  //<== this line causes problem!
}

接收组件：

routerOnActivate(curr: RouteSegment): void {
    let id = curr.getParam('id');
    this._service.getById(id)
        .subscribe(car => {
            // this code is executed when the response from the server arrives
            this.car = car;
            console.log("res: ", this.car);// <=== correct car, without the array of brands
        });
    // code here is executed before code from the server arrives
    // event though it is written below   
}

它创建了一个新实例＆＃34; Car＆＃34;。嗯，这一切都很好，但汽车还包含一系列品牌。

我的服务如下：

@Injectable()
export class Service {

    constructor(private http: Http) { }

    getCars(){
        return this.http.get...       
    }

    getById(id: string) {
        return this.http.get...       
    }    
}

和我的Car类一样：

export class Car {

    private brands: Array<Brand>;

    constructor(public id: string, public name: string) {
        this.brands = new Array<Brand>();
    }

    public getBrands(): Array<Brand> {
        return this.brands;
    }
    //some other methods.
}

所以我在品牌Array中也有一些数据，但由于getById方法创建了一辆新车，它只需要参数id和name，而品牌数组就变空了！我不知道如何从服务器端获取数据，以便它包含一系列品牌！

我（拼命）尝试在我的服务中创建一个Car，它会记录正确的数据......但显然不起作用。

getById(id: string) {
        this.http.get('app/car.json'+id)
        .map((res: Response) => res.json())
        .subscribe(car => {
            //this code is executed when the response from the server arrives
            this.car = car;
            console.log("res: ", this.car); // <==== correct data!
            return this.car;
        });
            //return this.car placed here doesn't give void error, but returns an undefined car, since the code gets executed before subscribe!
}

和接收组件：

routerOnActivate(curr: RouteSegment){
    let id = curr.getParam('id');
    this.car = this._service.getById(id); //error: Type 'void' is not assignable to type 'Car'
}

有什么建议吗？谢谢！

Answer 1

您每次都使用空数组初始化汽车：

export class Car {

    private brands: Array<Brand>;

    constructor(public id: string, public name: string) {
        this.brands = new Array<Brand>(); <-- every new Car() will end up with empty array
    }

    public getBrands(): Array<Brand> {
        return this.brands;
    }
    //some other methods.
}

您必须使用brands扩展构造函数：

constructor(public id: string, public name: string, public brands: Brand[]) {}

然后致电：

getById(id: string) {
   return this.http.get('app/car.json'+id)
     .map(data => data.json())
     .map(car => new Car(car.id, car.name, car.brands));  // <-- add brands
}

Answer 2

已经很久了，但我想我会把解决方案发布到我的问题上。我必须创建一个静态方法来使应用程序工作。如下：

getById(id:string)
    return this.http.get('app/car.json'+id)
      .map(data => data.json())
      .map(data => Car.carFromJSON(data))

然后在我的Car课程中：

static carFromJSON(json) {
    let id = json.id
    let name = json.name
    let brands: Brand[] =
        json.brands.map (brand => new Brand())
    return new Car(id, name, brands)
}

HTTP：getById创建新实例，缺少一个数组（Angular 2 RC1 + TS）

2 个答案: