javascript - AngularJS-在 Angular 变量中使用URL作为嵌入式youtube src

Question

我在 Angular 应用程序的前端中有以下代码

  <iframe ng-hide="entry.videoLocation == null" width="560" height="315"
     ng-src="{{entry.videoLocation}}" frameborder="0" allow="autoplay; encrypted-media"
     allowfullscreen></iframe>
  <li>VL: {{entry.videoLocation}}

基本上，在某些情况下，entry.videoLocation包含youtube视频的嵌入网址。如果要设置此视频，我想将其嵌入到我的页面中，如果不设置视频，则不希望将其嵌入。

设置变量后，iframe标记将显示在我的页面中，并且url将按预期方式打印在li标记中，并且当它们为null时，这两个标记都会丢失。

但是，始终缺少iframe标记的src属性。我尝试将属性src和ng-src都调用无济于事。

有人知道为什么不渲染吗？

Answer 1

我认为这不仅对视频有帮助，而且对PDF也有帮助，

<iframe class="img-responsive" src="{{pdfLoc| trustThisUrl }}" ng-style="{
                height: iframeHeight * 0.75 + 'px'
            }" style="width:100%"></iframe>

这里trustThisUrl只是过滤器，

angular.module("deck").filter('trustThisUrl', ["$sce", function ($sce) {
        return function (val) {
            return $sce.trustAsResourceUrl(val);
        };
    }]);