VideoJS、Meteor和模板的重新招标

在一个项目中，我们在Meteor应用程序中使用VideoJS播放器来播放一些视频。我们有一个播放列表来浏览视频。问题是，当模板被重新提交时，播放器就不能再初始化了

我已经为此编写了一个模板文件和coffescript部分：

<template name="videoPlayer">
<video id="videoJsPlayer" class="video-js vjs-default-skin"
    controls preload="auto" width="572" height="350"
    poster="...file.jpg"
    >
    <source src="...video.mp4" type='video/mp4' />
</video>
</template>

我还尝试将“vid_obj”放在全局的某个地方，并在前面调用videojs“destroy（）”方法。这就产生了一个错误，destroy（）不存在。另外，删除所有播放器绑定的V.players={}也不起作用。

尝试添加此代码

Template.videoPlayer.destroyed = function () {
    var mPlayer = vidoejs("#playerId");
    mPlayer.dispose();
}

---

每次Meteor渲染玩家模板时，它都会被销毁和创建。我希望这不会发生在新的流星渲染器Shark中。

我已经解决了我的问题。诀窍是不在模板上应用该样式

我通过jQuery添加了视频播放器：

if videojs.players.videoJsPlayer
    videojs.players.videoJsPlayer.dispose()

$v = $(".videoPlayerFrame")

$v.html("").append $("<video id=\"videoJsPlayer\" class=\"video-js vjs-default-skin \">")
    .attr("controls", true) 
    .attr("preload", "none")
    .attr("width", $v.attr("data-width"))
    .attr("height", $v.attr("data-height"))
    .attr("poster", $v.attr("data-poster"))
    .append("<source src=\""+$v.attr("data-video")+"\" type=\"video/mp4\" />")


$vid_obj = _V_ "videoJsPlayer", {}, ()->
    # console.log "video #{vid} is ready.";
    console.log "Element Loaded"

if videojs.players.videoJsPlayer
videojs.players.videoJsPlayer.dispose（）
$v=$（“.videoPlayerFrame”）
$v.html（“”）。追加$（“”）
.attr（“控制”，真）
.attr（“预加载”、“无”）
.attr（“宽度”），$v.attr（“数据宽度”））
.attr（“高度”），$v.attr（“数据高度”））
.attr（“海报”），$v.attr（“数据海报”））
.附加（“”）
$vid_obj=_V_“videoJsPlayer”，{}，（）->
#console.log“视频#{vid}已准备就绪。”；
console.log“元素已加载”

它不工作了。没有错误，只是不工作。还试图在初始化之前添加该代码，但这会删除标记。

if videojs.players.videoJsPlayer
    videojs.players.videoJsPlayer.dispose()

$v = $(".videoPlayerFrame")

$v.html("").append $("<video id=\"videoJsPlayer\" class=\"video-js vjs-default-skin \">")
    .attr("controls", true) 
    .attr("preload", "none")
    .attr("width", $v.attr("data-width"))
    .attr("height", $v.attr("data-height"))
    .attr("poster", $v.attr("data-poster"))
    .append("<source src=\""+$v.attr("data-video")+"\" type=\"video/mp4\" />")


$vid_obj = _V_ "videoJsPlayer", {}, ()->
    # console.log "video #{vid} is ready.";
    console.log "Element Loaded"