[解決済み] ルーターアウトレットの子コンポーネントへのデータの渡し方

質問

サーバーにアクセスしてオブジェクトを取得する親コンポーネントを持っています。

// parent component

@Component({
    selector : 'node-display',
    template : `
        <router-outlet [node]="node"></router-outlet>
    `
})

export class NodeDisplayComponent implements OnInit {

    node: Node;

    ngOnInit(): void {
        this.nodeService.getNode(path)
            .subscribe(
                node => {
                    this.node = node;
                },
                err => {
                    console.log(err);
                }
            );
    }

そして、いくつかの子供たちのディスプレイの一つで。

export class ChildDisplay implements OnInit{

    @Input()
    node: Node;

    ngOnInit(): void {
        console.log(this.node);
    }

}

にデータを注入することはできないようです。 router-outlet . ウェブコンソールでエラーが出るようです。

Can't bind to 'node' since it isn't a known property of 'router-outlet'.

これはなんとなくわかるのですが、次のようにするとどうでしょう。

1. 親コンポーネント内で、サーバーから "node" データを取得する。 コンポーネント内から、サーバーから "ノード" データを取得しますか。
2. サーバーから取得したデータを、子ルーター・アウトレットに渡しますか？

のようには見えません。 router-outlets は同じように動作するようです。

どのように解決するのですか？

<router-outlet [node]="..."></router-outlet> 

は単に無効です。ルータによって追加されたコンポーネントは、兄弟として <router-outlet> の兄弟として追加され、それを置き換えるものではありません。

参照 https://angular.io/guide/component-interaction#parent-and-children-communicate-via-a-service

@Injectable() 
export class NodeService {
  private node:Subject<Node> = new BehaviorSubject<Node>([]);

  get node$(){
    return this.node.asObservable().filter(node => !!node);
  }

  addNode(data:Node) {
    this.node.next(data);
  }
}

@Component({
    selector : 'node-display',
    providers: [NodeService],
    template : `
        <router-outlet></router-outlet>
    `
})
export class NodeDisplayComponent implements OnInit {
    constructor(private nodeService:NodeService) {}
    node: Node;
    ngOnInit(): void {
        this.nodeService.getNode(path)
            .subscribe(
                node => {
                    this.nodeService.addNode(node);
                },
                err => {
                    console.log(err);
                }
            );
    }
}

export class ChildDisplay implements OnInit{
    constructor(nodeService:NodeService) {
      nodeService.node$.subscribe(n => this.node = n);
    }
}