将来自数据库集合的JWplayer嵌入代码加载到meteor.js中的页面模板中 [英] Loading JWplayer embed code from database collection into a page template in meteor.js

问题描述

你好，我是流星和程序设计的新手.

Hello I'm new to meteor and programming in general.

我试图让我的页面从数据库集合动态加载JWPlayer视频嵌入代码.由于我为此应用程序/网站制作了100多个视频，因此我认为这是最简单的方法. 请告诉我是否有更好的方法！

I am trying to have my page load the JWPlayer video embed code dynamically from the database collection. Since I have over 100 videos being made for this app/site I figured this would be the easiest way. Please let me know if there is a better way to do this!!

问题似乎是数据库的javascript嵌入代码在页面之前加载，因此未得到执行.这是我的代码.

The issue it seems is the javascript embed code from the database is loading before the page and as such is not getting executed. Here is my code.

模板代码:

<template name="videos">
        {{{viddiv}}}
   <script type='text/javascript'>
        {{{vidscrip}}}
  </script>
</template>

数据库集合中的代码(已经正确地转义了，所以有点疯狂):

The code from the database collection (it's been properly escaped so it's kinda crazy):

vids.insert ({
    _id: "1",
    viddiv: '<div id=\'player64I7ulrK\'><\/div>',
    vidscrip: "jwplayer(\'player64I7ulrK\').setup({\r\n
               playlist: \'\/\/jwpsrv.com\/feed\/64I7ulrK.rss\',\r\n        
               width: \'100%\',\r\n        
               aspectratio: \'16:9\'\r\n    
               });"
});

启动我的应用程序并查看页面时，我可以看到所有内容都在其中并且看起来不错.但是脚本没有执行.

When I launch my app and view the page I can see that the everything is there and looks good. But the script isn't executing.

<div id="player64I7ulrK"></div>
<script type="text/javascript">
   jwplayer('player64I7ulrK').setup({
      playlist: '//jwpsrv.com/feed/64I7ulrK.rss',
      width: '100%',
      aspectratio: '16:9'
   });
</script>

这是我用来渲染视图的路线(正确的术语?).

And here is the route I am using to render the view (correct terminology?).

Router.map(function() {
   this.route('videos', {
    path: '/videos/:_id',
    data: function() {return vids.findOne(this.params._id); }
   });

});

我玩过Template.videos.rendered并添加了一个单独的js文件，其中包含嵌入代码.这确实有效，但是我不确定如何将代码动态地加载到此js文件中以形成数据库集合.这意味着我必须对每个嵌入=(

I've played with Template.videos.rendered and added a separate js file with the embed code in it. This did work, however I'm not sure how to load the code into this js file dynamically form the database collection. Which means I would have to hard code each embed =(

如果您想查看一下，这里是指向我的git存储库的链接！ https://github.com/jacksonvoice/VCU.git

Here is the link to my git repository if you would like to look at it! https://github.com/jacksonvoice/VCU.git

任何帮助都会很棒！我有点卡在这上面，需要一些帮助！

Any help would be great! I'm kind of stuck on this one and need some help!

提前谢谢！

推荐答案

将js代码作为转义字符串嵌入db中是不好的主意，因为它不易于管理，更改和使用. 相反，我会重构一下您的代码:

Embedding js code in db as escaped string is bad idea as it is not easy to manage, change, use. Instead I would refactor your code a little bit:

vids.insert({
   url:'//jwpsrv.com/feed/64I7ulrK.rss',
   width:'100%',
   aspectratio:'16:9',
   divSelector:'64I7ulrK'
})

Videos.html:

Videos.html:

<template name="videos">
  <div class="{{divSelector}}"></div>
</template>

Videos.js:

Videos.js :

   Template.videos.rendered = function () {
      jwplayer(this.data.divSelector).setup({
         playlist    : this.data.url,
         width       : this.data.width,
         aspectratio : this.data.aspectratio
      });
   };

这篇关于将来自数据库集合的JWplayer嵌入代码加载到meteor.js中的页面模板中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！