刷新列表：Angular2 + RxJS

我具有其中我顯示數據（用戶）的一個表中的組分從一個http請求的API生成的。有各種各樣的桌子上的過濾器，所以我生成表數據，如下所示：刷新列表：Angular2 + RxJS

this.displayUsers$ = Observable.combineLatest(
      this.users$, 
      this.siteFilter$, 
      this.clientFilter$, 
      this.activeFilter$, 
      this.nameFilter$ 
     ) 
      .map(([users, siteFilter, clientFilter, activeFilter, nameFilter]) => { 
       console.log("Users changed? ", users); 
       if (siteFilter === null 
        && clientFilter === null 
        && activeFilter === null 
        && nameFilter.length < 1) { 
        return users; 
       } 
       return users 
        .filter(user => { 
         // manipulate users array based on filters 
        }) 
      });

的xFilter$ s爲響應於在模板改變它們的輸入發射的新值BehaviorSubjects。 users$被分配如下：

this.users$ = this.userService.getList();

凡getList()返回一個HTTP請求來獲取用戶的列表。

列表成功更新每當過濾器改變了，但我有問題，當我需要更新與新的用戶列表。例如，用戶可以在用戶表上執行CRUD操作（即刪除用戶）。但是，當用戶被刪除時，該表不會更新以反映此更改。我目前使用的方法（試行），以新鮮的表是通過刪除操作的成功回調調用刷新功能：

refreshUserList() { 
     console.log("Refreshing user list"); 
     this.users$ = this.userService.getList(); 
    }

儘管手術後調用此完成，combineLatest觀察到的不再次得到「觸發」，列表數據仍舊陳舊。有沒有更好的方法來刷新combineLatest與http請求生成的數據？

來源

2017-10-10 natmegs

的主要問題是，在用戶列表中的情況下更新您的用戶$觀察到的不發出任何新的價值。你必須這樣做。

這是一個知道如何解決它的骨架：

const updateUsersTrigger = new Subject<void>(); 

this.displayUsers$ = Observable.combineLatest(
    // switchMap() will re-subscribe to this.userService.getList() observable on each emit from updateUsersTrigger 
    // thus making http requests each time when user list should be updated. 
    updateUsersTrigger.startWith(null).switchMap(() => this.userService.getList()), 
    this.siteFilter$, 
    this.clientFilter$, 
    this.activeFilter$, 
    this.nameFilter$ 
) 
    .map(([users, siteFilter, clientFilter, activeFilter, nameFilter]) => { 

    ....... 

}); 

// this will trigger user list update 
updateUsersTrigger.next();

來源

2017-10-10 19:22:40

這使得有很大的意義，感謝您的建議。我覺得我失去了與我然而實施東西，因爲現在我沒有得到任何表中的數據（即使當我改變過濾器）。我更改refreshUserList（）{updateUsersTrigger.next（）; }並在ngOnInit（）中調用它，但仍然沒有運氣。 – natmegs

@natmegs，嘗試這樣的事情：'updateUsersTrigger.startWith（空）.switchMap（（）=> ...呼叫服務...）'代替ngOnInit（）發光的東西 - 我不希望它的工作實際上，我認爲這太早了。 –

我不能沒有發表評論，所以我會在這裏寫，糾正我，如果我錯了，或者如果這超出了這個問題。如果您在成功使用.splice()刪除更新DOM而不是發送另一個HTTP請求的，那不是更容易和客戶端上少使勁？

來源

2017-10-10 19:32:37

無論哪種方式OP需要一些可觀察到發射新的數組，可以是HTTP請求或剪接（）導致一些Observable.map（）或別的東西。 –

刷新列表：Angular2 + RxJS

回答

相關問題