7章：Mastering Reactive Programming in Angular
を読んだので調べたことをつらつらと書く
RxJs
・takeUntil
引数のストリームをトリガーに、本ストリームを終了する。
https://qiita.com/mask610/items/d7758d120b4d8a82aef5
以下のようにすればunsubscribeしなくてもよくなる。
observable$.pipe(takeUntil(trigger$)).subscribe(value => {
console.log(value);
});
・takeUntilDestroyed
takeUntilの代わりにtakeUntilDestroyedが最新
protect destroy = inject(DestroyRef);
observable$.pipe(takeUntilDestroyed(this.destroy)).subscribe
value => {
console.log(value);
});
・AsyncSubject
値は最後のみ
completeで全部流れる
https://qiita.com/ksh-fthr/items/6c6cb89acce6fe756c60
・from
ofは数字、fromは配列
from([1, 2, 3])は1, 2, 3を順に流す
・forkJoin
全部のobservableが完了したら、最後の値を配列で返す
https://zenn.dev/milab/articles/0de6ceb46025f3
Signal
・effect
const count: WritableSignal<number> = signal(1);
const double: Signal<number> = computed(() => count() * 2);
console.log('conmputed:' + double);]
effect(() => {
console.log(<code>count is: ${count()}</code>);
});
effect((onCleanup) => {
onCleanup(() => {
console.log('cleanup');
});
});
https://zenn.dev/rdlabo/articles/f085832bed97b4
https://qiita.com/tronicboy/items/00633a52c7814e7c8ad6
まとめ
・signalとrxの使い分け
singalは簡単なイベントの実施や同期的なやりとりのみ
rxは複雑なコントロール
