Ręczne wyzwalanie detekcji zmiany kątowej

Użyłem accepted answer reference i chciałbym podać przykład, ponieważ dokumentacja Angular 2 jest bardzo trudna do odczytania, mam nadzieję, że będzie łatwiej: {]}

1. Import NgZone:

   import { Component, NgZone } from '@angular/core';
   

2. Dodaj go do swojej klasy konstruktor

   constructor(public zone: NgZone, ...args){}
   

3. Uruchom kod z zone.run:

   this.zone.run(() => this.donations = donations)
   

Udało mi się zaktualizować go za pomocą markForCheck()

Import ChangeDetectorRef

import { ChangeDetectorRef } from '@angular/core';

Inject and instantiate it

constructor(private ref: ChangeDetectorRef) { 
}

Na koniec zaznacz wykrywanie zmian

this.ref.markForCheck();

Oto przykład, w którym markForCheck() działa, a detectChanges() Nie.

Https://plnkr.co/edit/RfJwHqEVJcMU9ku9XNE7?p=preview

EDIT: ten przykład już nie przedstawia problemu: (wydaje mi się, że może działać nowszy Angular wersja, w której jest naprawiona.

(Naciśnij STOP / RUN, aby uruchomić go ponownie)

W Angular 2+ wypróbuj dekorator @ Input

Pozwala na pewne ładne powiązanie właściwości między komponentami nadrzędnymi i podrzędnymi.

Najpierw Utwórz zmienną globalną w rodzicu do przechowywania obiektu / właściwości, które zostanie przekazany dziecku.

Następnie Utwórz zmienną globalną w potomku, aby utrzymać obiekt / właściwość przekazaną od rodzica.

Następnie w nadrzędnym html, gdzie używany jest szablon potomny, dodaj nawiasy kwadratowe zapis z imieniem dziecka zmienną, następnie ustaw ją równą nazwie zmiennej macierzystej. Przykład:

<child-component-template [childVariable] = parentVariable>
</child-component-template>

Wreszcie, gdy właściwość child jest zdefiniowana w komponencie child, dodaj Input decorator:

@Input()
public childVariable: any

Gdy zmienna rodzica zostanie zaktualizowana, powinna przekazać aktualizacje do komponentu podrzędnego, który zaktualizuje jej kod html.

Również, aby uruchomić funkcję w komponencie potomnym, spójrz na ngOnChanges.