RxJS 菜鳥在這里，可能我完全錯了......
我正在嘗試通過其 ID 從 BehaviourSubject 陣列中獲取一個物件。
這是一些代碼：
服務.ts：
import { iBeer } from './../models/beer';
import { Injectable } from '@angular/core';
import { Observable, BehaviorSubject } from 'rxjs';
import { map } from 'rxjs/operators'
@Injectable({
providedIn: 'root'
})
export class BeerService {
private beers: iBeer[] = beerList;
private beerSubject = new BehaviorSubject<iBeer[]>(this.beers);
beers$ = this.beerSubject.asObservable();
getAll():Observable<iBeer[]>{
return this.beers$
}
getById(id:number){
return this.beers$.pipe(
map(beer => beer.find(beer => beer.id === id)))
}
}
組件.ts：
import { BeerService } from './../beer.service';
import { iBeer } from './../../models/beer';
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'shop',
templateUrl: './shop.component.html',
styleUrls: ['./shop.component.css']
})
export class ShopComponent implements OnInit {
beers!: iBeer[];
beerID?: iBeer;
id:number = 0;
constructor(private BeerService:BeerService) { }
ngOnInit(): void {
this.BeerService.getAll().subscribe(
(data:iBeer[]) => this.beers = data);
this.BeerService.getById(this.id).subscribe(
(data) => this.beerID = data)
}
selectedID(id:number){
this.BeerService.getById(id).subscribe(
(data) => this.beerID = data)
}
}
我遇到以下問題：
onInit 正確呼叫并顯示具有默認 id 值的物件。如果我嘗試從 html 輸入插入另一個 ID，它會正確轉到服務方法，但它始終回傳未定義。
我試圖洗掉 onInit 中的呼叫。如果我使用默認 ID 進行第一次呼叫，它會正確顯示相關項，但是如果默認 ID 是例如 3 并且我從第一次呼叫的 Html 輸入中設定了 1，它會回傳未定義。
我該如何解決這個問題？
uj5u.com熱心網友回復：
getById(id:number){
return this.beerSubject.value.find((beer) => beer.id === id);
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/net/376689.html
標籤：javascript 有角的 打字稿 rxjs
下一篇：Angular：從主題傳回真實值