在AngularJS中从可信源插入iframe
在AngularJS中从可信源插入iframe
提问于 2015-01-20 17:01:46
尝试使用ng-bind-html将iframe插入到AngularJS页面中&即使是最简单的形式，我也无法让它工作。
Javascript
function Ctrl($scope) {
$scope.showIt = '<iframe src="http://www.anything.com"></iframe>';
}My：
<div ng-bind-html="showIt"></div>Stack Overflow用户
回答已采纳
发布于 2015-01-20 17:08:19
您需要使用$sce服务告诉角在视图中呈现html内容。
角医生说
$sce是一种向AngularJS提供严格上下文转义服务的服务。SCE以这样的方式协助编写代码：(a)在默认情况下是安全的；(b)使对安全漏洞(如XSS、单击劫持等)的审核变得容易得多。
在此之前，您需要在应用程序中注入ngSanitize依赖项。
您可以使用filter或controller两种方式来完成它。
<div ng-app="app" ng-controller="mainCtrl">
Using Filter
<div ng-bind-html="showIt | toTrusted"></div>
Using Controller
<div ng-bind-html="htmlSafe(showIt)"></div>
</div>JavaScript码
var app = angular.module('app', ['ngSanitize']).
controller('mainCtrl', function ($scope, $sce) {
$scope.showIt = '<iframe src="http://www.anything.com"></iframe>';
$scope.htmlSafe = function (data) {
return $sce.trustAsHtml(data);
}
}).
filter('toTrusted', function ($sce) {
return function (value) {
return $sce.trustAsHtml(value);
};
});从角1.2开始，$sce特性就启用了下面的版本，您应该在角的配置阶段启用/禁用它。
app.config(['$sceProvider', function($sceProvider) {
$sceProvider.enabled(true);
}]);这是工频
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/28051061
复制相关文章
相似问题
腾讯云开发者
