6

我有一个带有名为 BookService 的服务的 Angular 项目。

private books: Subject<Book[]>;

getBookList(skip:number = 0,limit:number = 0): Subject<Book[]> {
  return this.books;
}

addBookToList(book:Book) {
}

该服务帮助我监视书籍列表中的更改，我还希望能够使用 addBookToList 函数将一本书添加到列表中，但我不知道如何将一本书添加到 this observable（主题观察者) 是否可以添加一本书

4

1 回答 1

12

主题是一种可观察对象。因此，它是一个流。您可以将一个项目（例如一本书）添加到流中，该项目将被广播给流的任何观察者。

但是，它不像普通的数组。一旦该项目被添加到流中并广播，它将不再可以在主题的“列表”中访问。它只能在订阅此主题的组件中访问。

向主题流中添加内容：

 this.books.next(book);

这会将其添加到流中并将其广播给所有现有订阅者。

如果您想保留书籍的“缓存”，请考虑将您的书籍定义为一个简单的数组，而不是主题。

这是我的一项服务的示例：

export class MovieService {
  private movies: Movie[];

  private selectedMovieSource = new Subject<Movie | null>();
  selectedMovieChanges$ = this.selectedMovieSource.asObservable();

  constructor(private http: HttpClient) { }

  changeSelectedMovie(selectedMovie: Movie | null): void {
    this.selectedMovieSource.next(selectedMovie);
  }

  // more code here
}

请注意，我的电影是一个包含我的电影“缓存”的实际数组。主题被设置为单独的属性。

你可以在这里看到我的完整示例：https ://github.com/DeborahK/MovieHunter-communication/tree/master/MH-4

查看 movie.service.ts 和调用它的电影组件。

更新：

另一种选择是使用 aBehaviorSubject来维护您的 Subject 的值并且可以随时引用：

private books: BehaviourSubject<Book[]> = new BehaviorSubject<Book[]>([]);

getBookList(skip:number = 0,limit:number = 0): BehaviorSubject<Book[]> {
  return this.books;
}

addBookToList(book:Book) {
  // apply the current value of your books Subject to a local variable
  let myBooks = this.books.getValue();
  // push that book into your copy's array
  myBooks.push(book);
  // apply the local updated array value as your new array of books Subject
  this.books.next(myBooks);
}

请注意，这每次都会将整个书籍数组添加到流中。

于 2018-08-15T18:53:43.317 回答