Как динамически добавлять видео-плеер с javascript?

Question

Любое просветление по этой проблеме было бы очень полезно.

Все, что я пытаюсь сделать, это динамически добавить проигрывателя videojs с javascript.

<div class="video-wrapper" ng-repeat="videos in panel"> 
     <button class="remove-video" ng-click="removeFromPanel($index)">x</button> 
     <video id="{{videos.id}}" class="video-js vjs-default-skin" preload="none" controls width="300" height="210" 
       poster="" > 
       <source src="{{videos.directory}}" type='video/mp4' /> 
     </video> 
    </div> 

Так что для каждого объекта в массиве «панель» я хочу показать видео. Если я попытаюсь добавить видео после того, как страница загрузится, видео не инициализируются должным образом, они просто добавят как обычные видео теги.

Я пытался использовать:

_V_("player id", { "controls": true, "autoplay": false, "preload": "auto" }, function(){ 
     // Player (this) is initialized and ready. 

     }); 

настроить плеер вручную, но без успеха.

У кого-нибудь была эта проблема и удалось ее исправить?

Я хотел бы сделать скрипт js для этого, но я использовал угловые для своего приложения, и я никогда не смогу заставить его работать правильно в jsfiddle.

Спасибо за чтение и помощь в заранее

Answer 1

Я решил эту проблему с помощью

myPlayer.dispose(); 

на объекте игрока затем с помощью

_V_("player id", { "controls": true, "autoplay": false, "preload": "auto" }, function(){ 
    // Player (this) is initialized and ready. 
    }); 

инициализации его после того, как я создал новый игрока в доме.

Итак, я полагаю, что моя проблема была связана с наличием 2 ссылок на один и тот же объект игрока.