Angular - notyfing auf Änderung

Question

Ich bin eine Seitennavigation mit Komponenten bauen, es ist so:

<site-wrapper> 
    <site-header> 
    <site-menu /> 
    </site-header> 
    <site-section /> 
    <site-section /> 
</site-wrapper> 

Und nun, meine site-wrapper ist wie folgt:

class siteWrapperController { 
    $onInit() { 
    this.sections = []; 
    } 

    addSection(section) { 
    if (this.sections.indexOf(section) === -1) { 
     this.sections.push(section); 
    } 
    } 
} 

app.component('siteWrapper', { 
    controller: siteWrapperController, 
    template, 
    transclude: true 
}); 

und meine site-section:

class siteSectionController { 
    $onInit() { 
    const id = this.sectionId; 
    const title = this.sectionTitle; 
    this.o = { id, title }; 
    this.wrap.addSection(this.o); 
    } 
} 

app.component('siteSection', { 
    template, 
    transclude: true, 
    controller: siteSectionController, 
    bindings: { 
    sectionTitle: '@', 
    sectionId: '@' 
    }, 
    require: { 
    wrap: '^siteWrapper' 
    } 
}); 

Was ich im Grunde tun hier ist es, dass ich jeden Abschnitt in Wrapper in seiner registrieren sections Array. Jetzt möchte ich weitergeben, dass sections-site-menu:

class siteMenuController { 
    $onInit() { 
    this.buildSections(this.wrap.sections); 
    } 

    buildSections(sections) { 
    Array.prototype.forEach.call(sections, s => { 
     console.log(s); 
    }); 
    } 
} 

app.component('siteMenu', { 
    controller: siteMenuController, 
    bindings: { 
    items: '<', 
    className: '@' 
    }, 
    template: template, 
    transclude: true, 
    require: { 
    wrap: '^siteWrapper' 
    } 
}); 

Leider ist es wieder leer. Das heißt, das läuft zu früh. Ich könnte einfach setTimeout dort werfen und fertig sein, aber ich glaube es gibt einen besseren Weg. Ich hoffe, $scope und $broadcast/$emit wegzulassen und nur die Komponenten irgendwie miteinander reden zu lassen ;-)

Was kann ich tun?

Answer 1

können Sie Uhr auf Variable setzen, die ausgeführt wird, wenn Wert der Variablen

zum Beispiel ändert sich, wenn Ihre Variable $ scope.newVar ist

dann können Sie Beobachter auf sie setzen

$scope.$watch('newVar',function(newval,oldval){ 
//your code goes here 
})