“没有提供程序"错误(即使我添加了提供程序) [英] 'No provider' error (even though I've added a provider)

查看:65
本文介绍了“没有提供程序"错误(即使我添加了提供程序)的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在尝试从特定的类调用服务,但是由于某种原因,即使我可以在其他类中使用它,也无法调用该服务.我正在使用@Input.我不知道这是否是导致问题的原因.

I'm trying to call a service from a particular class, but for some reason it can't be called, even though I am able to use it in other classes. I'm using @Input. I don't know if this is causing the problem.

代码:

import { Component, Input, OnInit } from '@angular/core';

import { Category } from './../Category';
import { CertService } from './../../shared/Service/cert.service';

@Component({
  selector: 'app-cert-item',
  templateUrl: './cert-item.component.html'
})
export class CertItemComponent implements OnInit {

  @Input() category: Category;
  @Input() categoryId: number;
  constructor(
    private certService: CertService //Console error "No provider for CertService!"
  ) { }

  ngOnInit() {
    console.log(this.certService.getCategories());
  }

}  

app.module.ts

app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { routing } from './app.routing';
import { ReactiveFormsModule } from '@angular/forms';
import { NgbModule } from '@ng-bootstrap/ng-bootstrap';

import { AppComponent } from './app.component';
import { HeaderComponent } from './shared/header.component';
import { DropdownDirective } from './dropdown.directive';
import { CertsComponent } from './certs/certs.component';
import { CertItemComponent } from './certs/cert-category/cert-item.component';

import { CertService } from './shared/service/cert.service';
import { HttpService } from './shared/Service/http.service';

import { LoginComponent } from './login/login.component';


@NgModule({
  declarations: [
    AppComponent,
    HeaderComponent,
    DropdownDirective,
    CertsComponent,
    CertItemComponent,
    LoginComponent
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule,
    routing,
    ReactiveFormsModule,
    NgbModule.forRoot()
  ],
  providers: [
    CertService, 
    HttpService
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }

我正在尝试调用的服务类(示例):

Service class I'm trying to call (sample):

import { Injectable } from '@angular/core';
import { Http, Response, Headers } from "@angular/http";
import { Observable } from "rxjs/Rx";
import 'rxjs/Rx';

@Injectable()
export class CertService {

  constructor(private http: Http) { }

  getCategories() {
    return this.http.get('api/categories')
   .map((response: Response) => response.json());
  }

}

我也无法使用以下方法获取当前路线:

I also can't get the current route, using:

this.subscription = this.route.params.subscribe(
      (params) => {...

...});

同样,上面的代码在其他类中也可以正常工作,但在该类中却不能.

Again, the code above works fine in other classes but not in this class.

推荐答案

如果提供者提供了某些错误,则会发生这种情况.而且不太可能有其他原因.

This will happen if something wrong was provided as a provider. And it is unlikely that there may be another reason for this.

在一个地方为...shared/service/cert.service,在另一个地方为...shared/Service/cert.service.案件很重要.取决于环境,在构建过程中这些模块会发生什么,但这可能会导致错误,例如它们可能会重复并指向不同的对象.

In one place it is ...shared/service/cert.service, and in another it is ...shared/Service/cert.service. Case matters. It depends on the environment what happens with these modules during build process, but this can cause errors, e.g. they may become duplicated and refer to different objects.

要快速调试此问题,可以将两个文件中的CertService分别显示为window.CertService1window.CertService2,并在控制台中进行比较(如果两个定义相同).

To quickly debug this, CertService can be exposed from both files as window.CertService1 and window.CertService2 and compared in console if both are defined and equal.

这篇关于“没有提供程序"错误(即使我添加了提供程序)的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆