Angular Ereignisänderungsdaten emittieren

Question

was ist der beste Weg, um das folgende Szenario vor:

In einer Komponente Ich habe eine Funktion, die wie so einen Array baut:

var arr = ['a','b']; 

In der übergeordneten Steuerung, I Ich möchte dieses Array bei Bedarf ändern können. Ich dachte, dass ich Ereignisse dafür verwenden könnte: In PHP (mit Laravel) kann ich durch Referenz eine Variable aufrufen, wenn ich auf dieses Ereignis höre und dadurch, wenn ich die Variable im listen Block verändere, wird die ursprüngliche Variable aktualisiert.

In eckig, habe ich versucht zu $emit ein Event auf dem rootScope und hören auf dieses Ereignis auf der übergeordneten Steuerung:

// directive controller 
$rootScope.$emit('$genericColumns', arr) 

// parent controller 
$rootScope.$on('$genericColumns', function($event, arr) { 
     arr = []; 
     return arr; 
    }); 

Aber dies zu tun, nicht die ursprüngliche arr Variable nicht verändert.

Was ist der beste Weg, dies zu erreichen? Wie kann ich eine Variable im Bereich der Kind-Direktive ändern, wenn sie benötigt wird?

Answer 1

Ich würde einen Dienst verwenden.

angular.module('app').factory('genericColumns', function(){ 
    var columns = {}; 

    columns.arr = []; 

    return columns; 
}); 

Offensichtlich werden Sie es richtig in Ihrer Anwendung verweisen müssen, habe ich app hier nur verwendet.

Dann injizieren Sie es in Ihren Controller (s) und sie werden die Daten teilen.

angular.module('app').controller('ColumnCtrl', function (genericColumns){ 
    $scope.columns = genericColumns.arr; 
}); 

Sie können immer noch die $ emittieren und $ auf für jeden Controller verwenden, werden darauf aufmerksam gemacht, wenn Änderungen vorgenommen wurden, obwohl ich würde vorschlagen, eine observer pattern für die Verwendung anstelle $rootScope zu verwenden.

Answer 2

Ich landete einen Service:

angular.module('common.directives.lists', []) 
       .factory('$generic', function() { 
        return {Columns: []}; 
       }) 

Dann in meine beiden Controller I $ generic injiziert. In meinem Direktiven-Controller habe ich meine Hauptspalten eingegeben und danach ein Ereignis auf $ rootScope $rootScope.$broadcast('$genericColumns') ausgestrahlt. Danach konnte ich das Ereignis $genericColumns auf dem übergeordneten Controller abhören, und dort würde ich das Array $ generic.Columns ändern (zusätzliche Spalten hinzufügen), und die Änderungen würden sich auch auf den Direktiven-Controller auswirken. Funktioniert ok.