Я использую угловой код для вызова остальных API и отображения его на экране

Question

Следующий код - мой код viewall.ts

   import { Component, OnInit } from '@angular/core';
    import { Injectable } from '@angular/core';
    import { HttpClient } from '@angular/common/http';

@Component({
  selector: 'app-viewall',
  templateUrl: './viewall.component.html',
  styleUrls: ['./viewall.component.css']
})

@Injectable()
 export class RestComponent  {
  constructor(private http: HttpClient) { }
  configUrl = "http://34.201.147.118:3001/getAllData";
  getConfig() {
   return this.http.get(this.configUrl);
  }
} 

Это мой код app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import {FormsModule} from'@angular/forms';
import { AppComponent } from './app.component';
import { RestComponent } from './rest/rest.component';
import { ViewallComponent } from './viewall/viewall.component';
import { HttpClientModule} from '@angular/common/http';

@NgModule({
  declarations: [
    AppComponent,
    RestComponent,
    ViewallComponent
  ],
  imports: [
    BrowserModule,FormsModule,
    HttpClientModule,
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

выдает следующую ошибку ERROR в src / app / app.module.ts (6,10): ошибка TS2305: Модуль 'E: /paramount/paramount/src/app/viewall/viewall.component " 'не имеет экспортированного члена' ViewallComponent '.

Answer 1

инъекционная услуга есть у провайдеров

Вы можете попробовать это решение.

providers: [
    RestComponent,
],


declarations: [
    AppComponent,
    ViewallComponent
],

В viewall component.ts

import { Component, OnInit } from '@angular/core';
    import { Injectable } from '@angular/core';
    import { HttpClient } from '@angular/common/http';

@Component({
  selector: 'app-viewall',
  templateUrl: './viewall.component.html',
  styleUrls: ['./viewall.component.css']
})
export class ViewallComponent{
    constructor() { }
}

@Injectable()
 export class RestComponent  {
  constructor(private http: HttpClient) { }
  configUrl = "http://34.201.147.118:3001/getAllData";
  getConfig() {
   return this.http.get(this.configUrl);
  }
} 

Answer 2

Где находится экспортируемый класс внутри viewall.component.ts? Вы должны экспортировать класс из компонента.

Разве вы не объявили RestComponent как Injectable и это тоже внутри viewall.ts, а затем импортируете его из файла rest.component внутри app.module.ts.

Попробуйте переместить RestComponent из массива объявлений в массив провайдеров, а также импортировать из правильного файла.

Надеюсь, это поможет.

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import {FormsModule} from'@angular/forms';
import { AppComponent } from './app.component';
import { RestComponent } from './rest/rest.component';
import { ViewallComponent } from './viewall/viewall.component';
import { HttpClientModule} from '@angular/common/http';

@NgModule({
  declarations: [
    AppComponent,
    ViewallComponent
  ],
  imports: [
    BrowserModule,FormsModule,
    HttpClientModule,
  ],
  providers: [
    RestComponent,
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }

Ваш viewall.component.ts должен экспортировать класс и выглядеть следующим образом: -

import { Component, OnInit } from '@angular/core';
    import { Injectable } from '@angular/core';
    import { HttpClient } from '@angular/common/http';

@Component({
  selector: 'app-viewall',
  templateUrl: './viewall.component.html',
  styleUrls: ['./viewall.component.css']
})
export class ViewallComponent{}