在 Angular 库中使用 RxJS

Posted 2023-02-22

【中文标题】在 Angular 库中使用 RxJS

【英文标题】：Use RxJS in an Angular library

【发布时间】：2019-08-13 11:32:28

【问题描述】：

我创建了一个角度库“mylib”

我创建了一个使用来自 rxjs 的 BehaviorSubject Observable 的服务。

例如

  currentLanguage = new BehaviorSubject<string>(null);

我在 mylib 中有一个组件，它将在选择输入的更改事件上设置语言。

this.myService.currentLanguage.next('en'); 

构建“mylib”并在myapp中使用后...我可以从myapp订阅myService。

如果我更改选择输入上的值，我可以看到该事件，但是没有下一个值发送到 BehaviorSubject，控制台中也没有错误。所以我不能从 mylib 的组件发出值变化。

但是...如果我从 myapp 发出下一个值...它可以工作...

所以我的问题是为什么不能从自定义角度库的组件中使用“下一个”，但它来自使用该库的组件......并且可以从应用程序的任何组件导入图书馆服务？

也许它可能与 mylib.module.ts 中的 @NgModule 相关，有可能我必须在 imports Array 中导入 rxjs 吗？我试着

 imports: [CommonModule, FormsModule, BehaviorSubject]

出错

一个想法？ :)

谢谢

迈克

【问题讨论】：

希望对您有所帮助，angular.io/guide/…

myLib的模块声明的exports中有myService吗？

【参考方案1】：

问题可能是 lib 和应用程序正在使用服务的两个实例。

确保在您的服务中指定了“providedIn: 'root'”。 例如：

@Injectable(
  providedIn: 'root',
)
export class myService 
.....

还要确保使用“dist”目录中的库名称导入服务，而不是使用相对路径。

例如：

import  myService  from 'myLib';

【讨论】：

是 @Injectable( providedIn: 'root') 已指定

您如何从应用程序的库中导入您的服务？使用“dist”目录中的库名称导入它，而不是使用相对路径。你能在 StackBlitz 中重现这个吗？

谢谢你！是服务库的路径... myapp 中建议的路径是错误的！非常感谢

请edit你的答案让它看起来更像一个答案。 ATM 它看起来像一个评论，但因为它帮助了 OP，所以你想更好地对其进行形式化

适当地编辑了我的答案。