“可觀察”類型上不存在屬性“地圖”<book[]> '</book[]>

Question

import { Injectable } from '@angular/core';
import { Book } from './book';
import { Observable } from 'rxjs';
import { of } from 'rxjs';
import 'rxjs/add/operator/map';




@Injectable({
  providedIn: 'root'
})
export class BookService {

  constructor() { }


  BOOKS : Book[]=[
    
    {"id": 1, "name" : "JavaScript",  "price" :"100", "description": "javscript"},
    {"id": 2, "name" : "Angualr",  "price" :"200", "description": "Angualr"},
    {"id": 3, "name" : "Sql server",  "price" :"3000", "description": "Sql server"},
    {"id": 4, "name" : "Typescript",  "price" :"5000", "description": "Typescript"},
    
  ]


  getBooks(): Observable<Book[]>{
    return of(this.BOOKS);
  }

  getBook(id: number): Observable<Book>{
    return this.getBooks().map(books=> books.find(book=>book.id === id));
  }
}

'Observable<Book[]>'.ts(2339) 類型上不存在屬性 'map'

'Observable<Book[]>'.ts(2339) 類型上不存在屬性 'map'

'Observable<Book[]>'.ts(2339) 類型上不存在屬性 'map'

'Observable<Book[]>'.ts(2339) 類型上不存在屬性 'map'

Answer 1

我想您使用的是 rxjs 6+ 版本（如果沒有，請提供您的版本），因此您需要使用可管道運算符而不是直接通過 observable 調用它們：

import {map} from 'rxjs/operators';

***

getBook(id: number): Observable<Book>{
  return this.getBooks()
    .pipe(map(books=> books.find(book=>book.id === id)));
}

---

https://rxjs.dev/guide/v6/pipeable-operators