-1

Angular 2 で基本的なアプリを作成しましたが、モジュールを介してコンポーネントの 1 つにサービスを挿入できません。

webpack でコンパイルした後、次のエラーが表示されます:「Angular 2 DI - すべてのパラメーターを解決できません」

// UserModule
import {NgModule} from '@angular/core';
import {CommonModule} from '@angular/common';
import {UserService} from "../services/user.service";
import {UserComponent} from "./user.component";

@NgModule({
    imports: [
        CommonModule
    ],
    declarations: [
        UserComponent
    ],
    exports: [UserComponent],
    providers: [UserService]
})
export class UserModule {}
// UserComponent
import {Component, Inject} from '@angular/core';
import {UserService, IUser} from "../services/user.service";
import {FormGroup, ReactiveFormsModule} from "@angular/forms";

@Component({
    templateUrl: './user.component.html',
    styleUrls: ['./user.component.css']
})

export class UserComponent {
    user: IUser[] = [];

    // constructor(private userService: UserService) {
    // does not work too
    constructor(@Inject(UserService) private userService: UserService) {
        this.user = this.userService.get({id: 1});
    }
}
// UserService
import {Injectable} from '@angular/core';
import {RequestMethod} from '@angular/http';

import {ResourceMethod} from 'ngx-resource/src/Interfaces';
import {ResourceAction, ResourceParams} from 'ng2-resource-rest';
import {RestClient} from '../shared/rest-client';

interface IQueryInput {
    id: number;
}

export interface IUser {
    id: number;
    name: string;
    description: string;
    user_content: IUserContent[];
}

export interface IUserContent {
    url: string;
    type: string;
    title: string;
}

@Injectable()
@ResourceParams({
    url: 'users'
})
export class UserService extends RestClient {
    @ResourceAction({
        path: '/',
        isArray: true
    })
    query: ResourceMethod<IQueryInput, IUser[]>;

    @ResourceAction({
        path: '/{!id}'
    })
    get: ResourceMethod<{id: any}, IUser[]>;
}

それはブラウザコンソールからのものです:

Uncaught Error: Can't resolve all parameters for UserService: (?, ?).
    at syntaxError (http://127.0.0.1:8000/vendor.bundle.js:41458:34) [<root>]
    at CompileMetadataResolver._getDependenciesMetadata (http://127.0.0.1:8000/vendor.bundle.js:54735:35) [<root>]
    at CompileMetadataResolver._getTypeMetadata (http://127.0.0.1:8000/vendor.bundle.js:54603:26) [<root>]
    at CompileMetadataResolver._getInjectableMetadata (http://127.0.0.1:8000/vendor.bundle.js:54589:21) [<root>]
    at CompileMetadataResolver.getProviderMetadata (http://127.0.0.1:8000/vendor.bundle.js:54878:40) [<root>]
    at http://127.0.0.1:8000/vendor.bundle.js:54808:49 [<root>]
    at Array.forEach (native) [<root>]
    at CompileMetadataResolver._getProvidersMetadata (http://127.0.0.1:8000/vendor.bundle.js:54769:19) [<root>]
    at CompileMetadataResolver.getNgModuleMetadata (http://127.0.0.1:8000/vendor.bundle.js:54424:50) [<root>]
    at CompileMetadataResolver.getNgModuleSummary (http://127.0.0.1:8000/vendor.bundle.js:54277:52) [<root>]
    at http://127.0.0.1:8000/vendor.bundle.js:54350:72 [<root>]
    at Array.forEach (native) [<root>]
    at CompileMetadataResolver.getNgModuleMetadata (http://127.0.0.1:8000/vendor.bundle.js:54335:49) [<root>]
    at JitCompiler._loadModules (http://127.0.0.1:8000/vendor.bundle.js:65516:64) [<root>]
4

1 に答える 1