首页 > 解决方案 > 将标签添加到 app.component.html 时,必须从注入上下文调用错误 inject()。帮我解决这个错误

问题描述

强文本:app.component.html 文件:

    enter code here

< h1 >{ { 标题 } }</ h1 >

<应用客户></应用客户>

strong text:
Customers.component.ts file:
`````````````````````````````````````````````````````````````````````````````
    enter code here
`````````````````````````````````````````````````````````````````````````````
import { Component, OnInit } from '@angular/core';
import {CustomerService} from '../customer.service';
import {Customer} from '../Customer';

@Component({
  selector: 'app-customers',
  templateUrl: './customers.component.html',
  styleUrls: ['./customers.component.css'],
  providers:[CustomerService]
})
export class CustomersComponent implements OnInit {
    Customers: Customer[];
    Customer: Customer;
    Customer_firstname:string;
    Customer_lastname:string;
    phone:string;

  constructor(private CustomerService: CustomerService) {this.CustomerService= CustomerService; }

  ngOnInit(): void {
        this.CustomerService.getCustomers()
            .subscribe( Customers =>
            this.Customers = Customers);
  }

}
``````````````````````````````````````````````````````````````````````````
strong text 
Customer.service.ts file:
```````````````````````````````````````````````````````````````````````````
    enter code here
````````````````````````````````````````````````````````````````````````
import { Injectable } from '@angular/core';
import {Http,Headers} from '@angular/http';
import {Customer} from './Customer';
import 'rxjs/add/operator/map';


@Injectable({
  providedIn: 'root'
})
export class CustomerService {

  constructor(private http:Http) { }


  getCustomers()
  {
    return this.http.get('http://localhost:3000/api/Customers')
    .map(res=>res.json());

  }

  addCustomer(newCustomer)
  {
    var headers= new Headers();
    headers.append('Content-Type','applicatoin/json');
    return this.http.post('http://localhost:3000/api/Customer', newCustomer,{headers:headers})
    .map(res=>res.json());
  }


  deleteCustomer(id)
  {
    return this.http.delete('http://localhost:3000/api/Customer'+id)
    .map(res=>res.json());
  }
}
``````````````````````````````````````````````````````````````````````````
strong text
app.component.ts file:

```````````````````````````````````````````````````````````````````````````
    enter code here
`````````````````````````````````````````````````````````````````````````````

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

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'OnlineBank app Works!';
}

强文本:当我将标签添加到 app.component.html 文件时,我遇到了这种类型的错误:


    enter code here
`````````````````````````````````````````````````````````````````````
ERROR Error: inject() must be called from an injection context
    at injectInjectorOnly (core.js:925)
    at Module.ɵɵinject (core.js:941)
    at Object.XHRBackend_Factory [as factory] (http.js:1445)
    at R3Injector.hydrate (core.js:16944)
    at R3Injector.get (core.js:16696)
    at injectInjectorOnly (core.js:931)
    at ɵɵinject (core.js:941)
    at injectArgs (core.js:1058)
    at Object.factory (core.js:17114)
    at R3Injector.hydrate (core.js:16944)
main.ts:12 Error: inject() must be called from an injection context
    at injectInjectorOnly (core.js:925)
    at Module.ɵɵinject (core.js:941)
    at Object.XHRBackend_Factory [as factory] (http.js:1445)
    at R3Injector.hydrate (core.js:16944)
    at R3Injector.get (core.js:16696)
    at injectInjectorOnly (core.js:931)
    at ɵɵinject (core.js:941)
    at injectArgs (core.js:1058)
    at Object.factory (core.js:17114)
    at R3Injector.hydrate (core.js:16944)

标签: angulartypescript

解决方案


我认为您的问题是由于:

@Injectable({
  providedIn: 'root'
})

我建议删除providedIn密钥并在providers您的部分中声明服务module


推荐阅读