"Не удалось выполнить ошибку postMessage" от Froogaloop через директиву AngularJS

Я написал директиву AngularJS для видео vimeo со встроенной функцией воспроизведения/паузы, используя их библиотеку froogaloop.

Он отлично работает! Единственная проблема заключается в том, что я получаю следующую ошибку при первой загрузке страницы.

Не удалось выполнить 'postMessage' в 'DOMWindow': заданное начало цели ('http://player.vimeo.com') не соответствует получателю начало окна

Я инициализирую объект froogaloop неправильно в директиве? Любые предложения были бы наиболее оценены.

Здесь вы можете проверить плункер: http://plnkr.co/edit/GKWNk3LhX0MR3lhpfqyA

Ответы

Ответ 1

Я рекомендую выполнить код в событии onLoad от <iframe>. Затем вы убедитесь, что код будет выполнен, когда iframe готов для приема сообщений.

Есть много способов сделать это:

  • Вы можете использовать jQuery, если вы уже имеете его в своем проекте: $('iframe').load(callback) или
  • напишите EventListener: iframe_element.addEventListener('load', callback) или
  • используйте обычный обратный вызов onload: iframe_element.onload = callback.

Где callback - метод, который использует Froogaloop.

Но вы должны знать, что некоторые из этих решений могут иметь некоторые недостатки в некоторых браузерах старых браузеров/MS.

Ответ 2

Для меня это похоже, что angularjs запускает API-интерфейс Player, прежде чем на самом деле отображает iframe на странице. По крайней мере, если я откладываю область действия. $Watch работает нормально:

$timeout(function() {
    scope.$watch('controlBoolean', function() {/* your code goes here */});
});