在Angular中重构$rootScope.$apply

Question

我的MusicPlayer.js Angular服务有一个包装在$rootScope.$apply中的回调函数，它更新一个特定的对象(musicPlayer.currentPlaybackTime)，并与所有其他控制器共享(通过应用于$rootScope)。

我知道理想情况下您会希望限制任何$rootScope污染，因此我正在研究可能的重构选项，这些选项取消了对$rootScope调用apply方法，但允许在多个控制器之间共享更新后的对象。

我的研究表明，我需要注册需要我的currentPlaybackTime对象的其他控制器(即PlayerDashboardCtrl.js、PlaylistCtrl.js和AlbumListCtrl.js)，但我想知道做这件事最有效的方法是什么。

谢谢。

 var setSong = function(song) {

    currentBuzzObject = new buzz.sound(song.audioUrl, {
        formats: ['mp3'],
        preload: true
    });

    currentBuzzObject.bind('timeupdate', function() {
        $rootScope.$apply(function() {
          musicPlayer.currentPlaybackTime = currentBuzzObject.getTime();  
        });
    });

    musicPlayer.currentSong = song;
};

Answer 1

在控制器之间共享数据的最好方法是创建一个service/factory，并使用这些服务从您想要的任何控制器获取数据。您必须在想要访问的所有控制器中对此服务执行inject操作。

这个书呆子的视频会让你有一个清晰的理解：Share data between controllers

与此类似的堆栈溢出问题：Stackoverflow answers to sharing data between controllers.

现场演示：Fiddle to show data sharing.