Question

我正在尝试使用meteor来操作一组自定义的html5视频控件。我的模板代码完全由以下内容组成：

Template.video.created = ->
  Session.set 'videoPlaying', false

Template.video.events
  'click .video-button-play': ->
    video = $('video')[0]
    if video.paused then video.play() else video.pause()
    Session.set 'videoPlaying', not video.paused

Template.video.helpers
  isPlaying: ->
    true

相关的html如下：

<div class="video-button video-button-play">
  {{#if isPlaying}}
    <i class="icon-pause"></i>
  {{else}}
    <i class="icon-play"></i>
  {{/if}}
</div>

以上工作原理是视频在正确的时间停止和启动，如果我从控制台查询会话数据，它就可以工作。然而，当我从助手读取会话数据的那一刻，一切都变得地狱 - 一些点击导致什么都没有，一些重启视频，另一些只是播放音频。特别疯狂的是，即使记录会话，如：

Template.video.helpers
  isPlaying: ->
    console.log Session.get('videoPlaying')
    true

导致同样的问题。

解决方案：我尝试使用保留并将视频放在一个恒定区域（感谢skeetmtp）并发现使用恒定区域是最佳解决方案，因为它允许我继续使用海报与视频。

Answer 1

每当videoPlaying正在发生变化时，Meteor正在重建整个“视频”模板，我想你的自定义html5视频就在这个模板中。你应该尝试（如果可能的话）

将其放在单独的模板中
在自定义html周围使用常量区域：http://docs.meteor.com/#constant
或使用保存：http://docs.meteor.com/#template_preserve

如果没有关于您的HTML代码的更多信息（特别是自定义视频控件），我无法帮助您。

流星会话不使用html5视频

1 个答案: