-1

我已经在 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>]
4

1 回答 1

0

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

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

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

你可能想先试试他们的例子

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

于 2017-05-07T08:49:15.890 回答