Question

对不起，我是离子（angularjs）的新手。我试图从字符串绑定，该字符串包含youtub视频网址。

<iframe width="280" height="150" src="//www.youtube.com/embed/UAHEQnOtzuw?list=UUj4nCgtjKJppK_IZeY8TUJg" frameborder="0" allowfullscreen></iframe>

在控制器中

$scope.videoElement.str = $scope.item.restData.videos[0].link;

在html中

<div ng-bind-html="videoElement.str"></div>

但我什么也看不见。：（

这是截图。 http://screencast.com/t/Fgct1sdnOon

我该如何解决这个问题？谢谢你的进步。

Answer 1

除非您使用$sce，否则链接不会附加到div。继续使用iframe并将网址嵌入为字符串：

<iframe width="280" height="150" ng-src="{{videoElement.str}}" frameborder="0" allowfullscreen></iframe>

如果您仍然需要将iframe绑定到div，那么这可能是您实现它的方法：

控制器：

$scope.frame= '<iframe src="' + $scope.videoElement.str + '"></iframe>';

查看：

<div ng-bind-html="frame| safeHtml">

其中safeHtml是一个过滤器指令，用于安全地绑定html并使用$sce - Documentation

在应用中包含此内容：

app.filter('safeHtml', function ($sce) {
    return function (val) {
        return $sce.trustAsHtml(val);
    };
});

<强>更新

如果$scope.videoElement.str是Iframe链接，则以下代码就足够了：

<div ng-bind-html="videoElement.str | safeHtml">

另外，如上所述在app.js中或控制器结束后添加safeHtml指令。

Answer 2

我认为你错过ngSanitize作为模块依赖。

例如：

    angular.module('bindHtmlExample', ['ngSanitize'])
.controller('ExampleController', ['$scope', function($scope) {
  $scope.myHTML =
     'I am an <code>HTML</code>string with ' +
     '<a href="#">links!</a> and other <em>stuff</em>';
}]);

HTML：

<div ng-controller="ExampleController">
 <p ng-bind-html="myHTML"></p>
</div>

我无法将字符串绑定到角度js中的html元素

2 个答案: