在开发中遇见了这个bug
Error: [$sanitize:badparse] The sanitizer was unable to parse the following block of html:
调查发现导致错误的原因是文本里带了html标签，使用ng-bind-html和 $sce.trustAsHtml();来解决这个问题。
$scope.text= $sce.trustAsHtml($scope.text);
但是因为字符串里有\n和\t等，使用$sce.trustAsHtml后文字无法换行，
我用了<br\>来替换字符串里的\n
$scope.test= $scope.test.replace(/\n/g,'<br>').replace(/\t/g,' ');
$scope.test= $sce.trustAsHtml($scope.test);
这样在第一次执行的时候是没问题的，但是如果执行第二次就报错了。
Error: $scope.test.replace is not a function
因为$scope.test不是字符串了变成Object了。判断一下如果是String才执行。
if($scope.test && typeof $scope.test === 'string'){
$scope.test= $scope.test.replace(/\n/g,'<br>').replace(/\t/g,' ');
$scope.test= $sce.trustAsHtml($scope.test);
}
以上就全部解决了我的问题。
---------------------------------------分割线----------------------------------------
后来发现了这篇文章，使用了filter更好的解决了我的问题，代码量更简洁。
angularjs中类似textarea的换行、空格处理
但是如果文本里包含尖括号类似于<xx>就会被当成HTML标签而不显示。那么在文本存入数据库前就要先进行字符转义。
$scope.t = $scope.t.replace(/</g,'<').replace(/>/g,'>');
filter 代码如下
// trustHtml filter
'use strict';
app.filter('trustHtml',function($sce){
return function(input){
function handlerStr(str) {
var text =str.replace(/\n/g,'<br />').replace(/\t/g,' ');
return text;
}
return $sce.trustAsHtml(handlerStr(input));
};
});
字符串替换参考文章
如何用js替换文本里的换行符\n?
$sce.trustAsHtml参考文章
Parse an HTML document with AngularJS
angular ng-bind-html $sce.trustAsHtml
深究AngularJS——$sce的使用
angular源码分析：angular中入境检察官$sce
