如何从角度控制器中调用ngDirective？

我正在写一个应用程序，使用angular-soundmanager2从soundcloud播放曲目。它可以工作，但是当我播放第二首曲目时，第一首曲目会在第二首曲目之前再次播放。如何从角度控制器中调用ngDirective？

如果我在加载第二页之前手动单击使用以下指令创建的“清除播放列表”按钮，则解决此问题。

<div id="playDiv" ng-show="audioAvailable"> 
    <br/> 
    <button play-pause-toggle data-play="Play" data-pause="Pause">Play</button> 
    <button clear-playlist>Clear Playlist</button> 
</div>

清除曲目的代码是用指令创建的。

ngSoundManager.directive('clearPlaylist', ['angularPlayer', '$log', 
     function(angularPlayer, $log) { 
      return { 
       restrict: "EA", 
       link: function(scope, element, attrs) { 
        element.bind('click', function(event) { 
         //first stop any playing music 
         angularPlayer.stop(); 
         angularPlayer.setCurrentTrack(null); 
         angularPlayer.clearPlaylist(function(data) { 
          $log.debug('all clear!'); 
         }); 
        }); 
       } 
      }; 
     } 
    ]);

添加曲目的代码基本上是。

if (data.soundcloud_track) { 

    SC.stream('/tracks/' + data.soundcloud_track.id , function(sm_object){ 

     var track = { 
       id: data.soundcloud_track.id, 
       title: data.soundcloud_track.title, 
       artist: data.soundcloud_track.artist, 
       url: sm_object.url 
     }; 

     $rootScope.audioAvailable = true ; 

    }) ;  

}

我可以访问全局变量ngSoundManager，soundManager和angular-soundManager。基本上我想先清除播放列表，然后添加新的曲目。

我如何将这个指令称为角度控制器？

来源

2016-08-23 Keith John Hutchison

这是一个非常棘手的问题，可以通过多种方式解决（服务共享一个对象，在rootcope事件..）。

我会走这条路，个人的看法：首先，把一个孤立的范围与可变你的指令

restrict: "EA", 
scope:{ 
    shareObj: '=' 
} 
link: function(scope, element, attrs) { 
    scope.shareObj = angularPlayer.clearPlaylist; 
}

和分享您的功能，你想从外部访问范围的变量。

然后，在你controllerJS：

$scope.shareObj = {}; 
$scope.clicked = function(){ 
    $scope.shareObj(); //you are calling the directive function, ha! 
}

和你的HTML：

<clear-playlist share-obj="shareObj"> </clear-playlist>

当心，你必须确保控制器的您的链接功能已被执行（因此函数创建）。如果你注入你的指令，DOM和立即需要执行的功能，它可以不工作：在这种特殊情况下，包您$ scope.share（）调用一个

$timeout(function(){ 
    $scope.share() 
}, 0);

，以确保消化周期已经发生。

来源

2016-08-23 10:08:48 Luxor001

该指令来自angular-soundmanager2库。如果指令无法改变，你将如何处理卢克索？ –

包裹所有反映原始指令事件的另一个（你的）指令。 – Luxor001

非常酷，谢谢:-) –

如何从角度控制器中调用ngDirective？

回答

相关问题