Angular 2 DI - 无法解析所有参数

时间:2017-05-07 08:31:49

标签: angular ng-modules ng2-resource-rest

我在Angular 2中构建了一个基本应用程序,并且无法通过模块将服务注入到我的一个组件中。

使用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>]

1 个答案:

答案 0 :(得分:0)

我认为您需要将ResourceModule.forRoot()添加到导入中。

如果您使用的是Typescript,则应删除@Inject()。

IMO,您的问题更像是如何正确使用ngx-resource。

你可能想先尝试他们的榜样

https://github.com/troyanskiy/ngx-resource