如何在 nx 模塊聯合中使用 BehaviorSubject？

Question

我有這個模塊聯合工作區

apps
-- host
---- src
------ app
-------- app.component.ts
-- main
---- src
------ app
-------- app.component.ts
libs
-- components
---- menu
------ src
-------- lib
---------- menu.component.ts
-- services
---- src
------ lib
-------- global.service.ts

全局服務.ts

items$ = new BehaviorSubject<any[]>([]);

setMenuItems(items: any[]): void {
    this.items$.next(buttons);
}

菜單.component.ts

items: any[];

ngOnInit(): void {
    this.globalService.items$.subscribe((result) => {
        this.items = result;
    });
}

主機應用程序 - app.component.ts

ngOnInit(): void {
    this.globalService.setMenuItems([1, 2, 3]); // this works
}

主應用程序 - app.component.ts

ngOnInit(): void {
    this.globalService.setMenuItems([1, 2, 3]); // this not works
}

我無法在我的主應用程序中使用全球服務。
這是我用來運行項目的命令： nx serve host--devRemotes="main"

Answer 1

那可能是因為您沒有進行被動編碼。

試試這個。

@Component(...)
export class MenuComponent {
  items$ = this.globalService.items$.asObservable();

  constructor(private globalService: GlobalService) {
}

<div class="menu">
  <div *ngFor="let item of items$ | async" class="menu-item">{{ item }}</div>
</div>

Answer 2

您是否在帶有 provideIn: 'root' 的服務類聲明中使用可注入裝飾器？

@Injectable({
  providedIn: 'root'
})