Question

我正在尝试将服务注入我的angular 2应用程序的根模块。

服务如下：

import { Injectable } from '@angular/core';

@Injectable()
export class UserService {

    loggedIn : boolean = false;
    username : string = "Test";
    password : string = "";

    constructor( ) {

    }

    login ( username : string, password : string ) {
        this.loggedIn = true;
        return this.loggedIn;
    }

    logout ( ) {
        this.loggedIn = false;
    }

    getUsername ( ) {
        return this.username;
    }
}

目前显然非常简单，但我只是想让它发挥作用

然后我尝试将其声明为我的根模块中的提供者，然后我在装饰器的bootstrap集合中得到它：

import { NgModule }      from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { routing, appRoutingProviders } from './app.routing';

import { LoginModule } from './login/login.module';
import { UserModule } from './user/user.module';
import { NavbarModule } from './navbar/navbar.module';

import { UserService } from './services/user.service'; 

import { AppComponent }  from './app.component';

@NgModule({
  declarations: [ AppComponent ],
  imports:      [ BrowserModule, routing, NavbarModule, UserModule, LoginModule],
  providers:    [ appRoutingProviders, UserService ],
  bootstrap:    [ AppComponent, UserService ]
})

export class AppModule {
}

然后我尝试在appComponent中使用此服务，如此

import { Component } from '@angular/core';

import { UserService } from './services/user.service';

@Component({
  selector: 'app',
  providers: [ UserService ],
  templateUrl: './app.template.html'
})

export class AppComponent {
    constructor ( private userService: UserService ) {
        console.log( userService.getUsername() );
    }
}

我在运行应用程序时遇到此错误

Can't resolve all parameters for AppComponent: (?)

关于为什么这不起作用的任何想法？我尝试了很多实现

Answer 1

从-b C:\..\A\A.WindowsService\bin\Release部分删除该服务。将它放在bootstrap部分就足以使服务可用作单身人士。同时将其从任何providers装饰器中删除。

Answer 2

正如angular docs中指出的那样应禁止在组件中使用providers数组，并在下一个rc中将其删除。

 @Component({ 
 selector: 'app',   
 templateUrl: './app.template.html'  //<-- removed providers array
 })

在app.module的提供者数组中包含您的服务将全局声明（您已经完成），如providers section中所述进行以下更改：

bootstrap:    [ AppComponent]` //<---UserService  removed

确保从正确的目录导入服务。

将服务注入根模块

2 个答案: