1

使用 AngularJS，我正在尝试将 vimeo 链接嵌入到我的一个页面。但是，根据用户是来自 HTTPs 还是 HTTP，我们将相应地更改 URL。

 <div class="video">
    <object width="640" height="480">
        <param name="allowfullscreen" value="true" />
        <param name="allowscriptaccess" value="always" />
        <param name="movie" value="{{sslCheck}}//vimeo.com/moogaloop.swf?clip_id=12345&amp;server=vimeo.com&amp;show_title=1&amp;show_byline=0&amp;show_portrait=0&amp;color=666699&amp;fullscreen=1" />
        <embed ng-src="{{sslCheck}}//vimeo.com/moogaloop.swf?clip_id=12345&amp;server=vimeo.com&amp;show_title=1&amp;show_byline=0&amp;show_portrait=0&amp;color=666699&amp;fullscreen=1" type="application/x-shockwave-flash" allowfullscreen="true" allowscriptaccess="always" width="640" height="480">
        </embed>
    </object>
</div>

控制器中的 sslCheck 将是"https:"或"http"。

问题是ng-src在 Google Chrome 中正确获取 HTTPs 和 HTTP 的 URL，但是

<param name="movie" value="{{sslCheck}}//vimeo.com/moogaloop.swf?clip_id=12345&amp;server=vimeo.com&amp;show_title=1&amp;show_byline=0&amp;show_portrait=0&amp;color=666699&amp;fullscreen=1" />

在谷歌浏览器中没有（尽管它在 FF 中有效）。在控制台中，我们可以看到它正在尝试获取

https://myDomain.com/ %7B%7BmovieURL%7D%7D //vimeo......

我是否需要为此创建一个指令，或者我可以使用 AngularJS 中的一些开箱即用的东西？

谢谢！

4

2 回答 2

1

实际上，我认为最好的方法是不使用 sslCheck。浏览器应该为您处理这个问题，类似于它对 CDN 的处理方式，例如：

<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.0.6/angular.min.js"></script>

所以你的代码就是：

<div class="video">
    <object width="640" height="480">
        <param name="allowfullscreen" value="true" />
        <param name="allowscriptaccess" value="always" />
        <param name="movie" value="//vimeo.com/moogaloop.swf?clip_id=12345&amp;server=vimeo.com&amp;show_title=1&amp;show_byline=0&amp;show_portrait=0&amp;color=666699&amp;fullscreen=1" />
        <embed ng-src="//vimeo.com/moogaloop.swf?clip_id=12345&amp;server=vimeo.com&amp;show_title=1&amp;show_byline=0&amp;show_portrait=0&amp;color=666699&amp;fullscreen=1" type="application/x-shockwave-flash" allowfullscreen="true" allowscriptaccess="always" width="640" height="480">
        </embed>
    </object>
</div>
于 2013-04-22T20:02:26.687 回答
1

看起来指令将是您最好的选择，但您实际上可以创建一个指令参数来模拟本机参数标记，如下所示：

module.directive("param", function(){
  return {
   scope: {
     value: "@",
   },
   link: function( scope, element, attrs ){
     element.attr("value", scope.value );
   }
  }
})
于 2013-04-22T20:10:54.750 回答