Question

我正在开发我的应用程序的服务，但是当我尝试加载页面时，它显示以下错误：

无法解析GameEditComponent的所有参数：（[object Object]， [object Object]，？）。

我尝试在服务中放置数组或只留下任何数据，但即使这样，错误也会继续

游戏edit.service.ts

import { Injectable } from '@angular/core';
import { Http } from '@angular/http';
import { Observable } from 'rxjs';

@Injectable()
export class GameEditService {

    constructor(private http: Http) { }

    getGame(id): Observable<any> {

        return this.http.get('http://localhost:8080/lightning/api/game' + id).map(res => res.json()).catch(error => {

            throw new Error(error.message);

        });

    }

    getManufactures(): Observable<any> {

        return this.http.get('http://localhost:8080/lightning/api/manufacture').map(res => res.json()).catch(error => {

            throw new Error(error.message);

        });

    }

    getPlatforms(): Observable<any> {

        return this.http.get('http://localhost:8080/lightning/api/platform').map(res => res.json()).catch(error => {

            throw new Error(error.message);

        });

    }

}

游戏edit.component.ts

import { ActivatedRoute, Params } from '@angular/router';
import { Component, OnInit } from '@angular/core';
import { GameEditService } from './game-edit.service';

@Component({
    moduleId: module.id,
    selector: 'app-game-edit',
    templateUrl: './game-edit.component.html',
    styleUrls: ['./game-edit.component.css', '../styles.css' ]
})
export class GameEditComponent implements OnInit {

    constructor(private activatedRoute: ActivatedRoute, private gameEditService: GameEditService, private id) {

        this.gameEditService.getPlatforms().subscribe(platforms => {

            console.log(platforms);

        }), erro => console.log(erro);

        this.gameEditService.getManufactures().subscribe(manufactures => {

            console.log(manufactures);

        }), erro => console.log(erro);

    }

    ngOnInit() {

        this.activatedRoute.params.subscribe((params: Params) => {

            this.id = params['id'];

            console.log(this.id);

        });

        this.gameEditService.getGame(this.id).subscribe(game => {

            console.log(game);

        }), erro => console.log(erro);

    }

    onSubmit(form){

        console.log(form);

    }

    verificaValidTouched(campo){

        return !campo.valid && campo.touched;

    }

    aplicaCssErro(campo){

        return {

            'subError': this.verificaValidTouched(campo)

        }

    }

}

这是即将到来的json，第一个是选定的游戏，第二个是平台，第三个是制造商

选择了json游戏

{
    "id":1,
    "name":"Street Fighter",  
    "category":"luta",
    "price":20.5,
    "quantity":1000,
    "production":true,
    "description":"descricao",
    "image":"ps4.jpg",
    "manufacture":
    {
       "id":1,
       "name":"Sony",
       "image":"ps4.jpg",
       "imageFullPath":"http://localhost:8080/lightning/images/ps4.jpg"
    }
}

json平台

{
    "id":1,
    "name":"PC",
    "image":"ps4.jpg",
    "imageFullPath":"http://localhost:8080/lightning/images/ps4.jpg"
}

json制造

{
    "id":1,
    "name":"Sony",
    "image":"ps4.jpg",
    "imageFullPath":"http://localhost:8080/lightning/images/ps4.jpg"
}

Console

我正在使用angular cli和最新版本的所有包。我不知道这个错误是因为你在游戏中遇到的平台，还是其他一些代码问题，如果你知道可以修复的东西，我尝试了几种我通过互联网找到的解决方案，但都没有用。

提前致谢。

Answer 1

问题是组件构造函数private id中的最后一个参数。 Angular将尝试解决此依赖关系，但无法找到id的可注入类。在查看代码时，我认为没有必要将id注入构造函数中。只需将其定义为组件的属性：

// ... import statements

@Component({
    moduleId: module.id,
    selector: 'app-game-edit',
    templateUrl: './game-edit.component.html',
    styleUrls: ['./game-edit.component.css', '../styles.css' ]
})
export class GameEditComponent implements OnInit {

    private id; // put the declaration of id here

    // remove id declaration from the constructor, no need to inject it
    constructor(private activatedRoute: ActivatedRoute, 
                private gameEditService: GameEditService) { // ...constructor code}

    // other code
}

Answer 2

否则，我解决了这个问题：我的问题是HttpClient有一种罕见的情况，它与app.module上的组件上的“ import”行不同……

在组件上是这样的：

import { HttpClient } from '@angular/common/http';

在应用程序模块中是这样的：

import { HttpClientModule } from '@angular/common/http';

Angular 2/4 - 无法解析GameEditComponent的所有参数：（[object Object]，[object Object]，？）

2 个答案: