Interaktion zwischen verschiedenen Steuerungen in AngularJS

Question

Einfaches Beispiel. Ich habe einen Spieler. Es ist in zwei Bereiche unterteilt: Song-Bereich (spielt gerade) und Playlist-Bereich.

Ich habe 2 Controller (Actually werde ich 2 Controller haben, deshalb frage ich): SongCtrl und PlalistCtrl;

Aber wie zwischen ihnen zu interagieren? Beispiel: Wenn ich mit der Wiedergabe von Songs beginne, muss ich sie auch in der Playlist markieren.

Answer 1

Sie könnten die Controller unter Verwendung von directives oder services miteinander interagieren lassen.

In Bezug auf Ihrem Beispiel:

hen I start playing song I need also highlight it inside of playlist. 

In diesem speziellen Fall, dass Sie von den Controllern direkt auf das DOM zu ändern vermeiden sollten. Sie könnten beispielsweise eine directive haben, die den Titel in der Wiedergabeliste hervorhebt,

Answer 2

Der beste Weg, dies zu tun ist mit einem Service. Angenommen, Sie haben einen Dienst für das Spielen der Songs verantwortlich haben (Über vereinfacht):

.factory('musicPlayer', function() { 
    var currentSongId; 

    // public API 
    return { 
    getCurrentSong: function() { return currentSongId; }, 
    setCurrentSong: function (id) { currentSongId = id; } 
    }; 
}); 

Sie können diese dann in Ihrer Playlist verwenden:

.controller('PlaylistCtrl', function ($scope, musicPlayer) { 
    $scope.isCurrentSong = function(idx) { 
    if ($scope.currentSong == idx) return true; 
    }; 

    $scope.play = function(idx) { 
    musicPlayer.setCurrentSong(idx); 
    }; 

    $scope.$watch(function() { 
    return musicPlayer.getCurrentSong() 
    }, function (id) { 
    $scope.currentSong = id; 
    }); 
}); 

So Ihrer Ansicht nach könnten dann Zugriff es:

<li ng-repeat="song in songs" ng-class="{ active: isCurrentSong($index) }"> 
    <a ng-click="play($index)">{{song.name}}</a> 
</li> 

Und Sie würden es ähnlich in Ihrem anderen Controller zugreifen, um das zu erhalten aktuell spielendes Lied. Ohne weitere Details ist es schwierig, genauer zu sein, aber dies ist der Best-Practice-Ansatz.