如何订阅数组更改?

uks*_*ksz 9 rxjs typescript angular

我想知道是否可以订阅更改对象,即数组.我的用例如下:用户重新加载页面,需要加载整个集合,然后获取一个具有特定id的对象.据我所知,我可以创建一个这样的函数:

在构造函数中:

this.getById(id);
Run Code Online (Sandbox Code Playgroud)

而且功能

getById(id: string){
    this.object = this.objectsService.getById(id);
    if (this.object.name){ //check if object exist
        //Do something
    } else {
        setTimeout(()=>{
            this.getById(id)
        }, 1000);
    }
}
Run Code Online (Sandbox Code Playgroud)

但是,我觉得这不是最好的事情.那么,我想做的是这样的事情:

let objects = this.objectService.getObjects() // returns object that will hold the collection;
objects.subscribe((value) => { 
    if(value.length) {
        //Do something
    }
});
Run Code Online (Sandbox Code Playgroud)

Dyl*_*eus 5

如果我正确理解了您的问题,那么您正在寻找从数组创建一个可观察对象,以便可以订阅它吗?如果是这样,您可能正在寻找 Rx.Observable.from(iterable, [mapFn], [thisArgs],[scheduler]rxjs文档中有一个关于此的页面。

它从数组创建一个可观察对象,然后可以订阅该对象。

您可能正在寻找这样的东西

 Rx.Observable.from([1,2,3]).subscribe(x => // do something with x);
Run Code Online (Sandbox Code Playgroud)

订阅更改数组

正如评论中指出的那样,以上方法订阅了该数组并观察了该数组中当前的值,但是它不处理对该数组的更改。

也许这里的一种方法是创建一个主题并观察该主题。您可以将值推送到Subject(基本上包含元素数组),而不是将值推送到现有数组。当您按下主题时,将生成一个可由订阅者捕获的事件。

  • 这将向订阅者发出3个值,但不会“订阅” OP描述的更改。 (2认同)

Toa*_*yen 3

您可以存储对数据数组的引用而不是Observable。例如,当来自 http 服务的调用返回Observable时,您可以这样做

function getObjects:Promise<Item[]>{
        return this.http.get(this.apiUrl)
                      .toPromise()
                      .then(this.extractData)
    }

    private extractData(res: Response) {
      let body = res.json();
      return body.data || { };
    }
Run Code Online (Sandbox Code Playgroud)

在您的组件类中,您可以像这样存储数据:

this.objectService.getObjects().then(items=> this.items = items);
Run Code Online (Sandbox Code Playgroud)

接下来,当您需要通过id获取项目时,您可以执行以下操作:

let currentItem = this.items.filter(x=> x.id == currentId)
Run Code Online (Sandbox Code Playgroud)

通过这种方式,您可以在页面加载时缓存列表,并在用户的选择更改时准备好值。