在ng-repeat中角化设置$sce

I am trying to display videos in iframe, but nothing gets displayed even though I am getting the right embed link for it. I have tried testing it by just displaying the link and the correct link gets displayed, and when I am hardcoding the same link for the iframe, videos gets displayed, but nothing gets rendered in the iframe when I am having it like this:

我正在尝试在iframe中显示视频，但是即使我得到了正确的嵌入链接，也不会显示任何内容。我尝试通过显示链接和正确的链接来测试它，当我为iframe硬编码相同的链接时，视频会被显示出来，但是当我这样做的时候，iframe中没有任何东西被呈现出来:

<ion-item ng-repeat="article in articles" class="item-light">
    <img ng-show="article.external_media.length == 0 || article.external_media.url == ''"  src="http://coop.app/imagecache/cover/{{article.cover_image}}">
    <iframe ng-show="article.external_media.length > 0 && article.external_media.url != ''" src="{{article.external_media[0].url}}"></iframe>
</ion-item>

Update

更新

Since I need to inject $sce dependency I wonder how to apply it to all the possible links in my controller. How would that function look?

由于我需要注入$sce依赖项，我想知道如何将它应用到我的控制器中的所有可能的链接。这个函数是什么样子的?

This is my controller:

这是我的控制器:

.controller('FrontPageController', function($scope, ArticleService, $state) {
  ArticleService.all().then(function(data){
    $scope.articles = data;
})

1 个解决方案

#1

Since I need to inject $sce dependency I wonder how to apply it to all the possible links in my controller. How would that function look?

由于我需要注入$sce依赖项，我想知道如何将它应用到我的控制器中的所有可能的链接。这个函数是什么样子的?

I'd recommend a filter for this.

我推荐一个过滤器。

.filter( 'safeUrl', [
    '$sce'
    function( $sce ){
        return function(url){
             //not sure which one you need here
             return $sce.trustAsUrl(url)
        }
    }
])

in your html

在你的html

<iframe src="{{article.external_media[0].url | safeUrl}}">

I advocate filters over controller methods only in I like to keep my controllers very lightweight. If something needs to be interpreted, I use a filter.

我提倡对控制器方法进行过滤，只在我喜欢保持控制器非常轻量。如果需要解释什么，我使用过滤器。

#1