在Angular和Ionic项目之间导入服务时,“必须从注入上下文调用inject()”

时间:2020-07-31 13:34:53

标签: angular ionic-framework code-sharing angular-dependency-injection

我正在尝试创建一种“最简单的”机制来在Angular Web项目和Ionic / Angular移动应用程序之间共享代码。我也一直在探索一种monorepo方法,但是我想我想看看是否有可能从移动项目中简单地导入生活在Web项目中的模块。

这似乎在多个Angular项目之间完美地工作,但是当我将服务(其本身使用另一项服务的 )导入Ionic项目时,出现运行时错误:'inject()必须从注入上下文中调用。”

我想知道这是否是一个可解决的问题,还是只是应该解决的问题?

我可以使用Angular 10.0.5和Ionic 6.11.0(本身安装Angular 9.1.6)以最少的一对新安装项目进行演示。

我尝试了一些通过搜索发现的建议:

  • 在angular.json中将preserveSymlinks设置为true
  • 在tsconfig.json中设置“路径”:{“ @ angular / ”:[“ ./node_modules/@angular / ”]}

我也尝试了几种在导入应用程序中提供服务的方式:

  • providedIn:根
  • app.module.ts中提供程序列表中的
  • 以[MyOtherService,{提供:MyService,useClass:MyService}]形式的显式提供程序

编辑: 为了演示该问题,我在Angular项目中创建了2个非常基本的虚拟服务,其中一个引用了另一个:

DummyService.ts

import {Injectable} from '@angular/core';
import {Dummy2Service} from './dummy2.service';

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

  constructor(private d2Service: Dummy2Service) {}

  get str() {return "Service 1";}

  get str2() {return this.d2Service.str;}
}

Dummy2Service

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

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

  constructor() {}

  get str() {return "Service 2";}
}

然后在Ionic项目中导致错误所需要做的就是在应用程序组件中引用一个虚拟服务(来自另一个项目):

// import references a service in another project
import {DummyService} from '../../../my-app2/src/app/dummy.service';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  constructor(private dummyService: DummyService) {
  }
}

0 个答案:

没有答案