Javascript 如何在Angular js中返回html代码作为过滤器的输出
我已经编写了一个与模式匹配的自定义过滤器,如果匹配为true,则将其转换为html,如何在{{test | toimgsrc}}内绑定html输出?我不想使用ng bind html或$sce,还有其他方法吗? 这是我的密码Javascript 如何在Angular js中返回html代码作为过滤器的输出,javascript,jquery,html,angularjs,Javascript,Jquery,Html,Angularjs,我已经编写了一个与模式匹配的自定义过滤器,如果匹配为true,则将其转换为html,如何在{{test | toimgsrc}}内绑定html输出?我不想使用ng bind html或$sce,还有其他方法吗? 这是我的密码 angular.module('demoApp',['toimage'])) .controller('MainController',函数($scope){ $scope.test='*!dsfsd!*'; }); angular.module('toimage',[]
angular.module('demoApp',['toimage']))
.controller('MainController',函数($scope){
$scope.test='*!dsfsd!*';
});
angular.module('toimage',[]).filter('toimgsrc',function(){
返回函数(文本){
正则表达式=/^\*!(\w*)!\*$/;
if(正则表达式测试(文本))
返回文本。替换(/^\*!(\w*)!\*$/,“$1”)
其他的
返回文本;
}
});代码>
{{test | toimgsrc}}
如角度文档所述:
默认情况下,Angular仅从与应用程序文档相同的域和协议加载模板。这是通过在模板URL上调用$sce.getTrustedResourceUrl来完成的。要从其他域和/或协议加载模板,您可以将其列入白名单或将其包装为可信值
这意味着您正在将值转换为html,这也需要确保安全,这就是唯一解决此问题的方法是使用$sce的原因,如下所示:
$scope.trustedHtml = $sce.trustAsHtml(yourGeneratedHtml);
<div ng-bind-html="trustedHtml"> </div>
$scope.trustedHtml=$sce.trustAsHtml(yourGeneratedHtml);
这样做的主要原因是要处理安全策略。谢谢!在那种情况下,我似乎必须坚持他们中的任何一个。