2015-11-25 46 views
0

我不知道如何正确地问这个问题,但我有一个功能,让用户添加一个嵌入的视频代码与视频标题一起在页面上显示视频。如何使用通用播放器的iframe来显示视频

我用的还有Vimeo的网站普遍IFRAME是:

<iframe src="//player.vimeo.com/video/VIDEO_ID" width="WIDTH" height="HEIGHT" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe> 

我使用淘汰赛绑定和显示数据。 所以在我的模型,我有

var videoModel = function(data){ 
    self={ 
     title: ko.observable(data.title || ''), 
     embedCode: ko.observable(data.embedCode || '') 
    }; 
    self.videoInfo = function(){..//open form for user to enter video title and embed code..} 

} 

在我看来的网页我有用户选择点击打开视频信息条目,但一旦信息被保存的iframe应与视频值显示。而这正是我有麻烦......这就是我目前有:

<!-- ko if: edit --> 
     <!-- ko ifnot: content().title --> 
      <a target="_blank" data-bind="click: videoInfo">Add/Edit Video</a> 
     <!-- /ko --> 
    <!-- /ko --> 

    <!-- ko ifnot: edit --> 
    <iframe src="//player.vimeo.com/video/VIDEO_ID" width="WIDTH" height="HEIGHT" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe> 
    <!-- /ko --> 

这里的视频嵌入代码的样本用户可以保存到显示器:

<iframe src="https://player.vimeo.com/video/92936956" width="500" height="281" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe> 
<p><a href="https://vimeo.com/92936956">The BIG Breakfast</a> from <a href="https://vimeo.com/vanderkloot">William VanDerKloot</a> on <a href="https://vimeo.com">Vimeo</a>.</p> 

我不知道我需要做什么或缺少以确保保存的视频显示在iframe中。目前我保存后我得到Oops! The embed code for this video is not valid.但是,当我在控制台调试时,我看到保存的数据在那里。我相信保存的实际视频ID不会代替VIDEO_IDiframe

+1

需要更多的代码。你如何设置编辑,video_id,可观察宽度等? – Dandy

+0

@Dandy编辑我有一个弹出窗口显示用户输入标题和他们想要的视频的嵌入代码,然后保存。我有那部分工作正常。它是获取嵌入代码实际显示在iframe中的问题。我不知道如何将嵌入代码值作为参数传递给iframe。 – 072et

回答

0

您可以使用html绑定显示嵌入代码,如果您将它存储在可观察值中。喜欢的东西

<textarea rows=10 cols=50 data-bind="textInput: embedCode" placeholder="Insert embed code"></textarea> 
<hr /> 
<span data-bind="html: embedCode"></span> 

function vm(){ 
    var self = this; 
    self.embedCode = ko.observable(); 
} 
ko.applyBindings(new vm()) 

的jsfiddle:http://jsfiddle.net/newuserjs/7wxLxgd1/

+0

哇 - 我想我是过度的这个。这很好!谢谢!我没有考虑'html'的绑定 – 072et

相关问题