Как использовать сервис из отдельного приложения Ionic 4 - PullRequest
0 голосов
/ 14 декабря 2018

Не удалось внедрить / загрузить службу из отдельного приложения Ionic 4 в наше основное приложение Ionic 4.

Цель - использовать службы из приложения SHARED в нашем приложении MAIN (клиент) и SECONDARY (ВТОРИЧНЫЙ (владелец) приложение.Но это приводит к StaticInjectionError:

Ошибка ERROR: Uncaught (в обещании): Ошибка: StaticInjectorError (AppModule) [BusinessService -> HttpClient]:
StaticInjectorError (платформа: ядро) [BusinessService -> HttpClient]: NullInjectorError: Нет поставщика для HttpClient!Ошибка: StaticInjectorError (AppModule) [BusinessService -> HttpClient]:
StaticInjectorError (Платформа: ядро) [BusinessService -> HttpClient]: NullInjectorError: Нет поставщика для HttpClient!в NullInjector.push ../ node_modules/@angular/core/fesm5/core.js.NullInjector.get (core.js: 717) в resolToken (core.js: 954) в tryResolveToken (core.js: 898) в



Настройка

  • ОСНОВНОЕ ПРИЛОЖЕНИЕ

Orders.page.ts (с BusinessService, импортированным из SHARED)

import { Component, OnInit } from '@angular/core';
import { BusinessService } from '../../../../Shared/src/app/providers/business.service';

@Component({
  selector: 'app-orders',
  templateUrl: './orders.page.html',
  styleUrls: ['./orders.page.scss']
})

export class OrdersPage implements OnInit {

  businessList: any;

  constructor(
    private businessService: BusinessService
  ) {}

  ngOnInit() {
    this.showBusinesses();
  }

  showBusinesses() {
    this.businessService.getBusinesses().subscribe(data => { 
    this.businessList = data; });
  }

}

App.module.ts (с BusinessService, импортированным из SHARED)

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { RouteReuseStrategy } from '@angular/router';
import { HttpClientModule } from '@angular/common/http';

import { IonicModule, IonicRouteStrategy } from '@ionic/angular';
import { SplashScreen } from '@ionic-native/splash-screen/ngx';
import { StatusBar } from '@ionic-native/status-bar/ngx';

import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { BusinessService } from '../../../Shared/src/app/providers/business.service';

@NgModule({
  declarations: [AppComponent],
  entryComponents: [],
  imports: [
    BrowserModule,
    IonicModule.forRoot(),
    AppRoutingModule,
    HttpClientModule
  ],
  providers: [
    StatusBar,
    SplashScreen,
    { provide: RouteReuseStrategy, useClass: IonicRouteStrategy },
    BusinessService
  ],
  bootstrap: [AppComponent]
})

export class AppModule {}

Настройка

  • Совместное приложение

business.service.ts

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


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

  baseURL: string;

  constructor(private http: HttpClient) {
    this.baseURL = 'http://192.168.10.107:3000/api';
  }

  getBusinesses() {
    return this.http.get(this.baseURL + '/businesses');
  }

}

App.module.ts

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { RouteReuseStrategy } from '@angular/router';

import { IonicModule, IonicRouteStrategy } from '@ionic/angular';
import { SplashScreen } from '@ionic-native/splash-screen/ngx';
import { StatusBar } from '@ionic-native/status-bar/ngx';

import { AppComponent } from './app.component';
import { AppRoutingModule } from './app-routing.module';
import { HttpClientModule } from '@angular/common/http';

@NgModule({
  declarations: [AppComponent],
  entryComponents: [],
  imports: [
    BrowserModule,
    HttpClientModule,
    IonicModule.forRoot(),
    AppRoutingModule
  ],
  providers: [
    StatusBar,
    SplashScreen,
    { provide: RouteReuseStrategy, useClass: IonicRouteStrategy }
  ],
  bootstrap: [AppComponent]
})

export class AppModule {}

Наши мысли

Исправьте нас, если мы ошибаемся!

ошибка выдается из private http: HttpClient в app.module.ts.Если мы удалим это, ошибка исчезнет.

Таким образом, мы попытались поместить службу в приложение MAIN с точно таким же кодом, и это работает отлично.Таким образом, мы считаем, что проблема заключается в импорте / соединении между двумя приложениями.

Мы успешно сделали это в Ionic 3, поэтому мы что-то упустили в новом Ionic 4?

EDIT1: размещено app.module.ts из приложения SHARED

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...