Javascript 没有视频，但我得到了vound-knockout.js与video.js的自定义绑定

/

我有一个应用程序，它使用“下一步/上一步”按钮循环浏览一系列视频。我使用knockout.js来控制UI，所以我创建了一个自定义绑定来初始化单个视频标记，然后当knockout移动到下一个视频时，它会更新一个可观察对象，该对象包含一个src对象数组

{src:，type:：}

。在这里，第一个视频没有音频（这是预期的），但如果您单击“下一步”并打开音频，您应该会听到一系列蜂鸣音-这是第二个视频的预期音频。但在第一次之后没有视频。而且，如果你试图回到第一个，它也不起作用

我已经在调试控制台中使用了它，customBinding的“update”方法中的video对象似乎一切正常——它的源设置正确——但似乎没有一种方法能够让我显示视频

我不确定这是不是我在使用击倒绑定时做错了什么，还是我对video.js有些误解

我的自定义绑定如下所示：

ko.bindingHandlers.video = {
  init: function(element, valueAccessor, allBindingsAccessor) {
    var videoSources = ko.utils.unwrapObservable(valueAccessor()).videos,
        playerId = allBindingsAccessor().playerId,
        options = { loop : true, controls: true, autoplay: true, preload: "auto" };

    videojs(playerId, options, function(){
        var video = this;
        video.src(videoSources).load().play();
    });
  },

  update: function(element, valueAccessor, allBindingsAccessor) {
    var videoSources = ko.utils.unwrapObservable(valueAccessor()).videos,
        playerId = allBindingsAccessor().playerId,
        video = videojs(playerId);

    video.pause().src(videoSources).load().play();
  }
};

以及标记：

<div id="assessmentIntroPanel" data-bind="with: currentStep">
  <div data-bind="video: videos, playerId: 'videoPlayer'">
    <video id="videoPlayer" class="video-js vjs-default-skin" width="430" height="267">
    </video>
  </div>
</div>

---

有什么想法吗？

我遇到过同样的问题

如果敲除绑定删除了视频元素（即使是暂时的），它也会破坏它们

通过确保“with”和“if”绑定不适用于视频，可以修复此问题

对于您的代码，这意味着：

<div id="assessmentIntroPanel" data-bind="with: currentStep">
  <div data-bind="video: videos, playerId: 'videoPlayer'">

  </div>
</div>
<video id="videoPlayer" class="video-js vjs-default-skin" width="430" height="267">
</video>

所以你的用户界面会更复杂。。。但现在，由于视频元素从未被移除，它应该可以工作了