角成分間通信

アングルV 10 .0.9
最初の2つの角度成分の間で通信しなければならなかったのは、親/子の関係で、@ outputと@ inputでとても簡単です.
しかし、初めてこの関係なく、私は完全に失われた.

サービスを作成する

ここでは、2つのコンポーネントを持っていると仮定しています.ng g service <name>

name it like you want !

生成されたサービスは次のようになります.

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

@Injectable({
  providedIn: 'root'
})
export class DataService {
  // Your code here
}

主題

私たちは主題を使用します.そして、値が多くの観察者にマルチキャストされることができる観察可能な特別なタイプです!
あなたのサービスのRxjsからの主題

import { Subject } from 'rxjs'

ここで、コンポーネント間でデータを共有するための課題を作成できます.

data: Subject<Type> = new Subject();

Subject can be any Typescript type

完了です！

ええ、本当に.
サービスをコンポーネントにインポートするだけです.

import { dataService } from "../services/data.service";

+

constructor(
    private sharedData: dataService,
  ) {}

データを得る

this.sharedData.data.subscribe(data => {
     //Do what you want with data 
})

data will be updated automatically

データを設定するには、次の手順に従います。

this.sharedData.data.next(newValue)

The data will be updated in ALL your components wich have subscribed to the value

.ltag__user__id__457505 .アクションボタン
バックグラウンドカラー:1 .重要
カラー:C 9 D 2 DD!重要
ボーダーカラー:1 .重要
｝

ニコララロデ

Hi ! I'm Nicolas, Français living at bordeaux in South West of the France, I'm full stack (MEAN) developper !
Nik0w
読書ありがとう!この記事はあなたの役に立ちましたか.共有できる任意のアイデア?以下のコメントを投稿!
これは私の最初の角のポストです、私はあなたがそれを愛することを望む!