Angular 2 - Variable in Service definiert, nicht in Sicht

Question

Guten Tag Leute, Ich habe diese verrückte Idee, Service als Cache-Speicher zu verwenden. deshalb habe ich im Service nur wenige Variablen definiert. Die Daten werden im Dienst aktualisiert, Änderungen werden jedoch nicht in der Ansicht angezeigt. Die View wird bereits ausgefüllt und der Service-Layer wird anschließend ausgeführt. Ich bin mir nicht sicher, auch wenn es eine gute Idee ist, Daten im Dienst zu speichern. kann jemand bitte Licht darauf werfen. hier ist mein Service-Code:

categories : SelectItem[]=[]; 

constructor(private utilityService:UtilityService) { 

} 

//populate all drop downs array with initial data from db 
populateAll() { 
//get categories 
this.getCategories(); 
//there are lot more calls here 
} 
private getCategories() { 
if(this.categories.length==0){ 
    this.utilityService.getAllCategories().subscribe(cat=>{ 
    this.categories = 
    this.utilityService.getSelectItemPublished(cat,"Category"); 
    }) 
    } 
} 

Dies ist, wie ich es in der Komponente nennen

constructor(
      private cache:CacheStoreService, 

     ) { } 

ngAfterViewInit() 
{ 
this.categories=this.cache.categories; 
this.depts=this.cache.depts; 
this.focuses=this.cache.depts; 
this.statuses=this.cache.statuses; 
this.phases=this.cache.statuses; 
this.visibilities=this.cache.visibilities; 

} 
ngOnInit() { 
    this.cache.populateAll(); 

Ihre Hilfe schätzen. Eine weitere Frage: Wie kann ich die Service-Möglichkeiten aktualisieren, wenn neue Daten in db-update den Cache hinzugefügt werden. ** Ich weiß, ich kann beobachtbar zurückkehren und es in Komponente abonnieren. Ich sehe anders aus. Nicht sicher, wenn es möglich ist? **

Danke

Answer 1

Hier ist, was passiert:

1. Der Dienst initialisiert wird, und seine Kategorien ist ein leeres Array
2. Sie den Service sagen, Daten zu holen, durch den Aufruf this.cache.populateAll()
3. Die Service-Methode sendet eine asynchrone Anfrage
4. Die Komponente speichert eine Referen ce zu den Kategorien des Dienstes in seinen eigenen Kategorien. Das Array ist immer noch leer
5. Lange danach kommt die Antwort auf die asynchrone Anfrage zurück. Der Rückruf wird aufgerufen. Es füllt das Array, auf das der Dienst und die Komponente verweisen, nicht auf. Stattdessen wird dem Feld Kategorien des Service ein neues Array zugewiesen. Die Komponente verweist immer noch auf das alte, leere Array.

Es gibt mehrere Möglichkeiten, das zu beheben.

Der erste Weg wäre, das Array nicht durch ein anderes zu ersetzen, sondern stattdessen das ursprüngliche Array zu füllen.

Die zweite Möglichkeit wäre, immer die Anordnung von der Dienstanforderung, anstatt eine zweite Referenz in der Komponente des Speicherns:

get categories() { 
    return this.cache.categories; 
} 

Die dritte Möglichkeit wäre, ein Ereignis aus einer beobachtbaren im Dienst zu emittieren , die die Komponente abonnieren würde, um die neuen Kategorien zu erhalten.