ng-repeat中的角度设置$ sce

时间:2016-07-05 15:26:59

标签: javascript angularjs iframe

我正在尝试在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>

更新

因为我需要注入$ sce依赖项,我想知道如何将它应用到我的控制器中的所有可能的链接。该功能如何?

这是我的控制者:

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

1 个答案:

答案 0 :(得分:2)

  

因为我需要注入$ sce依赖项,我想知道如何将它应用到我的控制器中的所有可能的链接。该功能如何?

我建议使用过滤器。

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

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

我主张在控制器方法上使用过滤器只是为了让我的控制器保持非常轻量级。如果某些事情需要解释,我会使用过滤器。