错误：提供的参数与呼叫目标的任何签名都不匹配

Question

我是Angular的新手，我在编译代码时遇到问题。

这是错误消息：app / car-parts.component.ts（17,27）：错误TS2346：提供的参数与调用目标的任何签名都不匹配。

码：

汽车零件。组件

import { Component } from '@angular/core';
import { CarPart } from './car-part';
import { RacingDataService } from './racing-data.service';

@Component({
    selector: 'car-parts',
    templateUrl: 'app/car-parts.component.html',
    styleUrls: ['app/css/car-parts.component.css']
})
export class CarPartsComponent{
    carParts: CarPart[];

    constructor(private racingDataService: RacingDataService){}

    // ngOnInit is invoked after the component is constructed
    ngOnInit(){
        let racingDataService = new RacingDataService();
//      this.carParts = racingDataService.getCarParts();
        this.racingDataService.getCarParts().subscribe(carParts => this.carParts = carParts);
    }
    getTotalCarParts(){
        let sum = 0;
        if(Array.isArray(this.carParts)){
            for(let carPart of this.carParts){
                sum += carPart.inStock;
            }
        }
        return sum;
//       return this.carParts.reduce((prev,curr) => prev + curr.inStock,0);
    }
    upQuantity(carPart){
        if(carPart.quantity < carPart.inStock)
            carPart.quantity++;
        else{
            alert("The ordered quantity exeeded the stocks");
        }
    }
    downQuantity(carPart){
        if(carPart.quantity > 0)
            carPart.quantity--;
    }
}

racing-data.service.ts

import { CARPARTS } from './mock';
import { Injectable } from '@angular/core';
import { CarPart } from './car-part';
import { Http } from '@angular/http';
import 'rxjs/add/operator/map';

@Injectable()
export class RacingDataService{

    constructor(private http: Http){

    }

    getCarParts(){
        return this.http.get('app/car-parts.json').map(response =>  <CarPart[]>response.json().data );
//      return CARPARTS
    }

}

Answer 1

尝试这个：

在提供商中添加service ：

@Component({
  ...,
  providers: [RacingDataService]
})

然后删除行：

let racingDataService = new RacingDataService();

来自ngOnInit() 。

应该是这样的：

ngOnInit(){
    this.racingDataService.getCarParts().subscribe(carParts => this.carParts = carParts);
}

希望这对您有用。

Answer 2

我对此Angular应用有类似的错误： 错误：无法解析CarPartsComponent的所有参数：（？） 。 这对我有帮助：

car-parts.component.ts ：

import { Component } from '@angular/core';
import { CarPart } from './car-part';
import { RacingDataService } from './racing-data.service'

@Component({
  selector: 'car-parts',
  templateUrl: './car-parts.component.html',
  styleUrls: ['./car-parts.component.css']
})
export class CarPartsComponent {
  carParts: CarPart[];

  ngOnInit() {
    this.carParts = this.racingDataService.getCarParts();
  }

  constructor(private racingDataService: RacingDataService) {}
}

app.component.ts

import { Component } from '@angular/core';
import { RacingDataService } from './racing-data.service'

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css'],
  providers: [RacingDataService]
})
export class AppComponent {
  title = 'Welcome to racing';
}