RxJS interop با خروجی‌های کامپوننت و directive

پکیج @angular/rxjs-interop دو API مرتبط با خروجی‌های کامپوننت و directive ارائه می‌دهد.

ساخت یک output بر پایه RxJS Observable

outputFromObservable به شما اجازه می‌دهد خروجی کامپوننت یا directiveای بسازید که بر اساس یک RxJS observable emit کند:

import {Directive} from '@angular/core';
import {outputFromObservable} from '@angular/core/rxjs-interop';

@Directive(/* ... */)
class Draggable {
  pointerMoves$: Observable<PointerMovements> = listenToPointerMoves();

  // Whenever `pointerMoves$` emits, the `pointerMove` event fires.
  pointerMove = outputFromObservable(this.pointerMoves$);
}

تابع outputFromObservable برای Angular compiler معنای ویژه‌ای دارد. فقط می‌توانید outputFromObservable را در initializerهای property مربوط به کامپوننت و directive فراخوانی کنید.

وقتی روی output، subscribe می‌کنید، Angular به صورت خودکار subscription را به observable زیرین forward می‌کند. وقتی کامپوننت یا directive destroy شود، Angular forward کردن مقدارها را متوقف می‌کند.

ساخت RxJS Observable از output کامپوننت یا directive

تابع outputToObservable به شما اجازه می‌دهد از output یک کامپوننت، یک RxJS observable بسازید.

import {outputToObservable} from '@angular/core/rxjs-interop';

@Component(/*...*/)
class CustomSlider {
    valueChange = output<number>();
}

// Instance reference to `CustomSlider`.
const slider: CustomSlider = createSlider();

outputToObservable(slider.valueChange) // Observable<number>
    .pipe(...)
    .subscribe(...);