Question

我是Angular派对的新手。我越来越 see error image here 我搜索了其他博客，他们建议的解决方案是将服务添加到app.module.ts->提供我已经在做的事情。

这是我的app.module.ts

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule } from '@angular/forms';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { MaterialModules } from "./app.material.module";

import { AppComponent } from './app.component';
import { HomeComponent } from "./components/home/home.component";
import { DashboardComponent } from "./components/dashboard/dashboard.component";
import { NavbarComponent } from "./components/navbar/navbar.component";

import { AppRoutingModule } from './app-routing.module';
import { ChartsModule } from 'ng2-charts';

import { HttpErrorHandler } from "./helpers/http-error-handeler.service";
import { MessageService } from "./helpers/message.service";
import { DashboardService } from "./services/dashboard.service";

@NgModule({
    imports: [
        BrowserModule,
        BrowserAnimationsModule,
        FormsModule,
        AppRoutingModule,
        ChartsModule
    ],
    declarations: [
        NavbarComponent,
        AppComponent,
        HomeComponent,
        DashboardComponent
    ],
    providers: [DashboardService],
    bootstrap: [AppComponent]
})
export class AppModule { }

这是我的组成部分

import { Component, OnInit } from '@angular/core';
import { Order } from "../../models/dashboardOrder";
import { DashboardService } from '../../services/dashboard.service';

@Component({
    selector: 'dashboard',
    templateUrl: 'dashboard.component.html'
})
export class DashboardComponent implements OnInit {

    constructor(private dash: DashboardService) {

    }

    ngOnInit() {

    }
}

我的服务是

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Order } from "../models/dashboardOrder";

import { Observable } from 'rxjs';
import { catchError } from 'rxjs/operators';

@Injectable()
export class DashboardService {

    constructor(
        private http: HttpClient) {

    }

    GetOrdersShipped(stores: string): Observable<Order[]> {
        return null;
    }
}

我的应用程序上的代码我得到了您在问题顶部的链接中看到的 Null-injector 异常。我已经将该服务添加到mu app.module.ts提供程序中。

有人可以告诉我，为了成功配置服务，我在文件中缺少什么？

Answer 1

您在应用程序模块中缺少HttpClientModule。将此行添加到您的应用模块顶部

import { HttpClientModule } from '@angular/common/http';

这行到模块的imports部分

@NgModule({
imports: [
    BrowserModule,
    BrowserAnimationsModule,
    FormsModule,
    AppRoutingModule,
    ChartsModule, 
    HttpClientModule
],
declarations: [
    NavbarComponent,
    AppComponent,
    HomeComponent,
    DashboardComponent
],
providers: [DashboardService],
bootstrap: [AppComponent]})

NullInjectorError：没有e的提供者！在Angular 7上

1 个答案: