Angular 2 Observable Refresh

Question

我想從父組件更新操作後，在父級刷新我的表。

@Service

getLicenses(){ 
    ... 
    return this.http.post(url","",options) 
     .map((result: Response) => result.json()) 
      .map((data: License[]) => { 
       this.licenses = data; 

       return this.licenses; 
      }) 
      .catch(this.handleError); 
} 

@父組件

ngOnInit() { 
    this.licenseService.getLicenses().subscribe(licenses => { 
              this.licenses = licenses; 
}); 

一切都看起來不錯的初始化。我有桌子上的數據。 當從表中選擇一行時，我將它傳遞給子組件並執行更新操作。更新後，我想刷新表並調用getLicenses（）方法的服務。但它不會刷新。如果我調用另一個方法進行測試，它會刷新我的表格。

getLicenses2(){ 
    this.licenses.pop(); 
    this.licenses.pop(); 
    this.licenses[2].isFree= !this.licenses[2].isFree; 
    } 

此外，我測試如下，這不刷新。

getLicenses2(){ 

     this.http.post(url,"",options) 
      .map((result: Response) => result.json()) 
       .map((data: License[]) => { 
        this.licenses = data; 
        this.licenses.pop(); 
        this.licenses.pop(); 
       }) 
       .catch(this.handleError); 
    } 

爲什麼這個工作時，我手動更改數組？ 爲什麼我分配json的數據時不工作？

我的迴應是OK沒有異常，第一次初始化工作得很好。如果我只是用f5新數據刷新表，那麼更新操作也會成功。 （我是新來的角2）

編輯

它有或無主題，如果我只是改變陣列工作，但它不工作時，我這樣做是在HTTP POST

我試着用學科。這一次沒有孩子。當我打電話給http post時，初始化不起作用。參見下面的測試方法。

@Service我有

private licenses2 = new Subject<License[]>(); 
licenses2$ = this.licenses2.asObservable(); 

@父組件

ngOnInit() { 
    this.licenseService.licenses2$.subscribe(licenses => { 
     this.licenses = licenses; 
    }); 
    this.licenseService.getLicenses2(); 
} 

工作

getLicenses2() { 
    let test: License[] = []; 
    test.push(new License()); 

    this.licenses2.next(test) 
} 

不工作

getLicenses2(){ 
    this.http.post(URL,"",options) 
     .map(response => { 
       this.licenses2.next(response.json() as License[]) 
     }) 
     .catch(this.handleError); 
    } 

謝謝。

Answer 1

一種解決方案是使用Subject。從我的理解中可以看出，你正試圖更新父表中的父表，並且這樣做是行不通的，因爲如果你這樣做的話更新只存在於子表中。因此，您可以做的是告訴家長在需要時更新數據。因此，嘗試以下操作：

聲明一個主題在你的父母：

public static updateStuff: Subject<any> = new Subject(); 

，並在你的父類的構造訂閱：

ParentComponent.updateStuff.subscribe(res => { 
    // here fire functions that fetch the data from the api 
    this.getLicenses(); // add this! 
}) 

，並在你的子組件，每當你做出改變，應該是在父級更新這樣做：

ParentComponent.updateStuff.next(false); 

例如，當做了一個post請求在你的孩子：

// this is the method you call in your child component to do the post request 
postChanges() { 
    this.myService.updateTable() 
    .subscribe(data => { 
     this.data = data; 
     ParentComponent.updateStuff.next(false); // add this, will update the parent! 
    }) 
} 

...然後它應該工作:) Remeber也取消:)