Question

使用AngularJS，我试图在我的一个页面中嵌入一个vimeo链接。但是，根据用户是来自HTTP还是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中为HTTP和HTTP正确提取网址，但

<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中的一些开箱即用的东西？

谢谢！

Answer 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>

Answer 2

看起来这里的指令似乎是你最好的选择，但你实际上可以创建一个指令param来模仿本机param标签：

module.directive("param", function(){
  return {
   scope: {
     value: "@",
   },
   link: function( scope, element, attrs ){
     element.attr("value", scope.value );
   }
  }
})

AngularJS中“值”属性的ng-src的等效值

2 个答案: