角度コントローラ内でngDirectiveを呼び出す方法は？

Question

私は、angle-soundmanager2を使用してsoundcloudからトラックを再生するアプリケーションを作成しています。それは動作しますが、2番目のトラックを再生すると、2番目のトラックの前に最初のトラックが再び再生されます。

次のディレクティブで作成された[プレイリストのクリア]ボタンを手動でクリックしてから、2番目のページを読み込むと、この問題は解決されます。

<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にアクセスできます。 まず、プレイリストをクリアしてから、新しいトラックを追加したいと思います。

どのように私はこのコントローラを角度コントローラと呼んでいますか？

Answer 1

これは非常に扱いにくく、さまざまな方法で解決できます（オブジェクトを共有するサービス、ルートスコープのイベント..）。まず、あなたの指示に変数を

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); 

に呼び出しますダイジェストサイクルが発生しました。