ページに複数のvideogularビデオが必要で、それぞれの下にビデオを開始するためのボタンがあります。ここで説明したように、すべてのビデオにスコープを設定するには、それらをディレクティブに入れる必要があります。
ただし、videogular の API にはアクセスできません。問題は onPlayerReady 関数にあると確信しています。APIについてはかなり多くのドキュメントがありますが、うまく動作させることはできませんでした。
指令:
.directive("topmVideogularDirective", function () {
return {
restrict: 'E',
scope: {
data: "=",
config: "="
},
template: '<videogular vg-plays-inline="true" vg-player-ready="onPlayerReady"><vg-media vg-src="data" vg-native-controls="false" vg-loop="true"></vg-media></videogular><button ng-click="test()">test</button>',
link: function (scope) {
scope.$API = null;
scope.onPlayerReady = function($API) {
console.log("tell me you're there");
scope.$API = $API;
};
scope.test = function(){
scope.$API.play();
};
}
};
完全なコード ペン: http://codepen.io/anon/pen/dMKKbX
SOに関する別のおそらく関連する質問もあります。新しいビデオを再生するときにバックグラウンドで再生されている他のビデオを停止します
上記の Github に関するディスカッション: https://github.com/videogular/videogular/issues/59