Wistia onReady 事件在 Angular 控制器中多次触发

Question

寻求一些帮助，了解如何防止 onReady 在与 $window 结合使用时在 Angular/Ionic 应用程序中多次触发。具体来说，我们将这种方法用于 Wistia 视频（按照指示 here）。违规代码是：

$window._wq = $window._wq || [];
$window._wq.push({ id: "5bbw8l7kl5", onReady: function(video) {
    console.log("I got a handle to the video using Wistia's onReady method!", video.uuid);
}});

使用$window._wq 会导致多次执行onReady 方法，这是怎么回事？

我们如何使这段代码对 Angular 友好（无需“破解”或强制变通），以便 onReady 在每次重新访问控制器视图时只触发一次？

如果您愿意，我提供了一些示例代码，可用于在本地重现问题here。

任何见解、想法、想法将不胜感激！

Answer 1

这些是可能导致问题的选项
1.我认为您有多个具有相同 ID 的视频。
2.在api页面他使用_wq.push而不是$window._wq.push
3. 您使用的是 Angular，您是否检查过您有两个具有相同 ng-model 或 ng-click 事件的视频

Answer 2

您可能有多个这样的匿名函数回调浮动。我建议将 onReady 回调提取到一个单独的函数中，并将该函数传递给对象中的 onReady。

$window._wq = $window._wq || [];
$window._wq.push({ id: "5bbw8l7kl5", onReady: onReadyCallback });
var onReadyCallback = (video) => { console.log('I got a handle to the video using Wistia's onReady method!', video.uuid };

这将帮助您至少将代码与匿名函数隔离开来，并隔离函数的调用者，这将帮助您追踪多个事件触发的根本原因。您可能在范围内也有多个控制器实例，但我没有任何 Wistia 或 Ionic 经验。