diff --git a/README.md b/README.md index 9c13375..c08ab32 100644 --- a/README.md +++ b/README.md @@ -146,6 +146,8 @@ Operators are functions. There are two kinds of operators: **ajax** - It creates an observable for an Ajax request with either a request object with url, headers, etc or a string for a URL. +Example with Angular: + ```typescript import 'zone.js/dist/zone'; import { Component, OnInit } from '@angular/core'; @@ -163,71 +165,35 @@ import { ajax } from 'rxjs/ajax'; }) export class App implements OnInit { ngOnInit() { - const githubUsers = `https://api.github.com/users?per_page=2`; - - const users = ajax(githubUsers); - - const subscribe = users.subscribe( - (res) => console.log(res), - (err) => console.error(err) - ); + const githubUsers = ajax('https://api.github.com/users?per_page=2'); + githubUsers.subscribe((res) => console.log(res.status, res.response)); } } bootstrapApplication(App); ``` -**bindCallback** - `bindCallback` operator is used to convert a callback-style function into an observable. +[Stackblitz Angular Example Link](https://stackblitz.com/edit/angular-ees5qn?file=src%2Fmain.ts) -It allows you to work with asynchronous APIs that follow the Node.js-style callback pattern, where the last argument of a function is a callback function that is invoked with the result or error. +Example with TypeScript: ```typescript -import 'zone.js/dist/zone'; -import { Component, OnInit } from '@angular/core'; -import { CommonModule } from '@angular/common'; -import { bootstrapApplication } from '@angular/platform-browser'; -import { bindCallback } from 'rxjs/ajax'; - -@Component({ - selector: 'my-app', - standalone: true, - imports: [CommonModule], - template: ` -

bindCallback Example

- - `, -}) -export class App implements OnInit { - - ngOnInit() {} +import { ajax } from 'rxjs/ajax'; - performAsyncOperation() { - const boundAsyncFunction = bindCallback(this.someAsyncFunction); +const githubUsers = ajax('https://api.github.com/users?per_page=2'); +githubUsers.subscribe((res) => console.log(res.status, res.response)); +``` - boundAsyncFunction().subscribe(([error, result]) => { - if (error) { - console.error('An error occurred:', error); - } else { - console.log('Result:', result); - } - }); - } +[Stackblitz TypeScript Example Link](https://stackblitz.com/edit/rxjs-umrlkx?file=index.ts) - someAsyncFunction(callback: (error: any, result: any) => void) { - // Simulating an asynchronous operation - setTimeout(() => { - const error = null; - const result = 'Hello, world!'; - callback(error, result); - }, 2000); - } -} +**bindCallback** - `bindCallback` operator is used to convert a callback-style function into an observable. -bootstrapApplication(App); -``` +It allows you to work with asynchronous APIs that follow the Node.js-style callback pattern, where the last argument of a function is a callback function that is invoked with the result or error. **bindNodeCallback** - `bindNodeCallback` is a function that converts a Node.js-style callback function into an Observable. +Example with Angular: + ```typescript import 'zone.js/dist/zone'; import { Component, OnInit } from '@angular/core'; @@ -282,6 +248,8 @@ export class App implements OnInit { bootstrapApplication(App); ``` +[Stackblitz Angular Example Link](https://stackblitz.com/edit/stackblitz-starters-avcder?file=src%2Fmain.ts) + **defer** - Creates an Observable that, on subscribe, calls an Observable factory to make an Observable for each new Observer. ```typescript