Trong Angular, taptoán tử trong RxJS được sử dụng để thực hiện các tác dụng phụ cho từng giá trị được phát ra từ một luồng có thể quan sát được mà không cần sửa đổi hoặc chuyển đổi chính các giá trị đó. Đây là cách bạn có thể sử dụng taptrong Angular:

1. Nhập taptoán tử từ RxJS bằng câu lệnh nhập sau:

import { tap } from 'rxjs/operators';

import { Component, OnInit } from '@angular/core';
import { UserService } from './user.service';
import { tap } from 'rxjs/operators';

@Component({
  selector: 'app-users',
  template: `
    <ul>
      <li *ngFor="let user of users">{{ user.name }}</li>
    </ul>
  `
})
export class UsersComponent implements OnInit {
  users: any[];

  constructor(private userService: UserService) {}

  ngOnInit() {
    this.userService.getUsers()
      .pipe(
        tap(user => console.log(user))
      )
      .subscribe(users => this.users = users);
  }
}

1. Ghi nhật ký quan sát

import { of } from 'rxjs';
import { tap } from 'rxjs/operators';

const observable = of(1, 2, 3);

observable
  .pipe(
    tap(value => console.log(`Value emitted: ${value}`))
  )
  .subscribe();

2. Sửa trạng thái

Một trường hợp sử dụng khác tap()là sửa đổi trạng thái bên ngoài Observable. Đây là một ví dụ về cách bạn có thể sử dụng tap()để tăng bộ đếm cho mỗi giá trị được phát ra bởi một Observable:

import { of } from 'rxjs';
import { tap } from 'rxjs/operators';

let counter = 0;

const observable = of(1, 2, 3);

observable
  .pipe(
    tap(() => counter++)
  )
  .subscribe();

console.log(`Counter value: ${counter}`); // Output: Counter value: 3

3. Gỡ lỗi quan sát

tap()cũng có thể hữu ích để gỡ lỗi các Đài quan sát. Ví dụ: bạn có thể sử dụng tap()để ghi nhật ký bắt đầu và kết thúc của một Có thể quan sát, cũng như bất kỳ lỗi nào xảy ra:

import { of } from 'rxjs';
import { tap } from 'rxjs/operators';

const observable = of(1, 2, 3);

observable
  .pipe(
    tap({
      next: value => console.log(`Value emitted: ${value}`),
      complete: () => console.log('Observable completed'),
      error: error => console.log(`Error: ${error}`)
    })
  )
  .subscribe();

Tôi hy vọng những ví dụ này giúp bạn hiểu cách sử dụng tap()toán tử trong RxJS!

Tăng cấp mã hóa

Cảm ơn vì đã là một phần của cộng đồng của chúng tôi! Trước khi bạn đi:

• Vỗ tay cho truyện và theo dõi tác giả
• Xem thêm nội dung trong ấn phẩm Level Up Coding
• Khóa học phỏng vấn mã hóa miễn phí ⇒ Xem khóa học
• Theo dõi chúng tôi: Twitter | LinkedIn | bản tin