Question

所以我试图使用jade和angular.js嵌入视频。我尝试在jade中使用以下代码，但angular没有处理它，而当我键入p {{video.updated_time}}没有问题，但以下代码不起作用

iframe(ng-src="{{video.embedLink}}")

我也试过写一个角度指令。这是指令的代码

app.directive('embedDirective', function() {

    return {
        restrict: 'A',
        template: '<div style="height:315px;width:560px;"><iframe class="video"     style="overflow:hidden;height:100%;width:100%" width="100%" height="100%" src="{{url}}" frameborder="0" allowfullscreen></iframe></div>'
    };
});

我在我的玉文件中使用它：div(embed-directive, url="video.embedLink")。这些解决方案似乎都不适合我。唯一不同的是，当我使用指令时，控制台中没有显示失败的嵌入处理错误，但iframe中的src为空。没有括号没有方程标记，只是在iframe中间的src。同样在iframe中似乎有html，head和body标签，这些标签在我的指令中不存在。我很困惑

Answer 1

似乎有角度试图保护应用程序免受外来链接的影响，因此需要对其进行“验证”。一条链接。这是我发现最容易的。只需在控制器中添加此功能

即可

$scope.trustSrc = function(src) {
    return $sce.trustAsResourceUrl(src);
}

然后这就是人们应该如何使用<iframe></iframe>与玉

iframe(ng-src="{{trustSrc(video.embedLink)}}", src="", widht="560", height="315", frameborder="0", allowfullscreen)

当然，$sce应该在控制器依赖项中。

Angular.JS + Jade = angular not processing jade的嵌入iframe

1 个答案: