角2：錯誤：src / app / mage / mage.component.ts（19,98）：'，'預期。）app / mage / mage.component.ts（19,100）：找不到名稱'response'。）

Question

我在嘗試將angular 2服務掛接到另一個Angular 2組件時遇到此錯誤：

ERROR in ./src/app/mage/mage.component.ts
Module build failed: Error: /Applications/MAMP/htdocs/angular2/ng2/src/app/mage/mage.component.ts (19,98): ',' expected.)
/Applications/MAMP/htdocs/angular2/ng2/src/app/mage/mage.component.ts (19,100): Cannot find name 'response'.)

為什么會這樣呢？ 如果可能的話，請嘗試幫助我，不要拒絕投票，因為這是我第二次使用Angular 2，我對Angular 2非常陌生。之所以問這個問題，是因為我的最后一個Angular 2問題被投票否決了，並且變成負分數。 謝謝你不否定我對地獄的深惡痛絕:)

這是mage.component.ts：

import { Component } from '@angular/core';
import { MageService } from './mage.service';
import { OrdersStats } from './orders.stats';
import { OrderStatusStat} from './order.status.stat';

@Component({
  selector: 'my-mage',
  templateUrl: './mage.component.html',
  styleUrls:['./mage.component.css']
})
export class MageComponent {

  ordersStatistics:OrdersStats; 

  constructor(private mageService: MageService) { }

  ngOnInit() {
      this.mageService.getMagentoData().subscribe(response => <OrdersStats>this.ordersStatistics = response);
  }
}

這是orders.stats.ts：

export class OrdersStats {

    total:number;
    orderStatusesStats:OrderStatusStat[];
}

這是mage.service.ts：

import { Injectable } from '@angular/core';
import { Http } from '@angular/http';
import { Response } from '@angular/http';
import { OrderStatusStat } from './order.status.stat';
import { OrdersStats } from './orders.stats';
import 'rxjs/add/operator/map';

@Injectable()
export class MageService {

  constructor(private http: Http) { }

  getMagentoData() {
      return this.http.get("http://localhost:80/angular2/ng2/middleware/MiddleWare.php")
      .map(response => <OrdersStats>response.json().data);
  }

}

這是orders.status.stat.ts：

export class OrderStatusStat {

    status:string; //Name of the status
    count:number; //How many orders with this status
    totalAmount:number; //Total amount of all orders with this status

}

Answer 1

您不能以箭頭功能的簡寫形式使用投射，您應該這樣編寫：

ngOnInit() {
   this.mageService.getMagentoData().subscribe((response) => {
        this.ordersStatistics = <OrdersStats>response;
   });      
}