W angleular2, jak uzyskać zmiany w zmianach właściwości dla obiektu wysyłanego dla @Input

Question

Mam dyrektywę i na niej jest @Input, która akceptuje klasę.

@Directive({selector: 'my-directive'}) 
@View({directives: [CORE_DIRECTIVES]}) 
export class MyDirective { 
    @Input() inputSettings : SettingsClass; 
    @Input() count : number; 

    onChanges(map) { 
     console.log('onChanges'); 
    } 
} 

Dyrektywa służy w html:

... 
    <my-directive [input-settings]="settings" [count]="settings.count"></my-directive> 
    ... 

Jeśli settings.count zmienia się wówczas onChanges będzie ogień. Jeśli jakakolwiek inna właściwość w klasie ustawień ulegnie zmianie, to nie zostanie uruchomiona.

Jak mogę wykryć, czy na jakiejś właściwości w ustawieniach?

Answer 1

kątowy zauważy tylko wtedy, gdy obiekt został zmieniony na inny obiekt (czyli odniesienia obiektu zmienione), więc ngOnChanges() nie może zostać użyte do rozwiązania twojego problemu. Aby uzyskać więcej informacji, patrz Victor Savkin's blog post.

Możesz zastosować metodę ngDoCheck() w swojej klasie MyDirective. Ten hak cyklu życia jest nazywany "za każdym razem, gdy sprawdzane są właściwości wejściowe komponentu lub dyrektywy, użyj go, aby rozszerzyć wykrywanie zmian, wykonując niestandardową kontrolę."

Aby zaimplementować metodę wyboru niestandardowego, to trzeba najpierw wdrożyć .equals() metodę na klasy SettingsClass takie, które można następnie napisać kod taki jak poniżej w ngDoCheck():

ngDoCheck() { 
    if(!this.inputSettings.equals(this.previousInputSettings)) { 
     // inputSettings changed 
     // some logic here to react to the change 
     this.previousInputSettings = this.inputSettings; 
    } 
} 

Answer 2

w HTML nie można używać CamelCase, zmień go na

<my-directive [input-settings]="settings" [count]="settings.count"></my-directive>