Angularjs 如何同时使用 nl2br 和 linky 过滤器?
How to use nl2br and linky filter together in Angularjs?
我正在尝试使用如下多个过滤器,
<p><span ng-bind-html="someVar | nl2br | linky"></span></p>
什么都不渲染。
但是,当我如下更改过滤器的顺序时
<p><span ng-bind-html="someVar | linky | nl2br"></span></p>
linky 有效,但 nl2br 无法将换行符转换为 br.
以下实现可用于 nl2br:
.filter('nl2br', function($sce) {
return function(input) {
return $sce.trustAsHtml( input.replace(/\n/g, '<br>') );
}
}
以 zeroflagL 的评论为基础 - 保持正常状态直到结束。
<p><span ng-bind-html="someVar | nl2br | linky | trustMe"></span></p>
删除所有信任 - 这样我们就可以 return 一个普通的字符串:
.filter('nl2br', function($sce) {
return function(input) {
return input.replace(/\n/g, '<br>');
}
}
我们要做的最后一件事是增加一些信任:
.filter('trustMe', function($sce) {
return function(input) {
return $sce.trustAsHtml( input ) );
}
}
所以我能够让它与 someVar | linky | nl2br
一起工作。问题出在 linky 过滤器上。 ngSanitize 的 linky 过滤器将 \r 和 \n 分别更改为
和
。给定的 nl2br 过滤器无法捕捉到这些。
感谢这个要点 https://gist.github.com/kensnyder/49136af39457445e5982 , 修改 nl2br 如下
angular.module('myModule')
.filter('nl2br', ['$sanitize', function($sanitize) {
var tag = (/xhtml/i).test(document.doctype) ? '<br />' : '<br>';
return function(msg) {
// ngSanitize's linky filter changes \r and \n to and respectively
msg = (msg + '').replace(/(\r\n|\n\r|\r|\n| | | | )/g, tag + '');
return $sanitize(msg);
};
}]);
工作fiddlehttp://jsfiddle.net/fxpu89be/4/
然而,它仍然没有解决以相反顺序使用它的原始问题,即 someVar | nl2br | linky
我正在尝试使用如下多个过滤器,
<p><span ng-bind-html="someVar | nl2br | linky"></span></p>
什么都不渲染。 但是,当我如下更改过滤器的顺序时
<p><span ng-bind-html="someVar | linky | nl2br"></span></p>
linky 有效,但 nl2br 无法将换行符转换为 br.
以下实现可用于 nl2br:
.filter('nl2br', function($sce) {
return function(input) {
return $sce.trustAsHtml( input.replace(/\n/g, '<br>') );
}
}
以 zeroflagL 的评论为基础 - 保持正常状态直到结束。
<p><span ng-bind-html="someVar | nl2br | linky | trustMe"></span></p>
删除所有信任 - 这样我们就可以 return 一个普通的字符串:
.filter('nl2br', function($sce) {
return function(input) {
return input.replace(/\n/g, '<br>');
}
}
我们要做的最后一件事是增加一些信任:
.filter('trustMe', function($sce) {
return function(input) {
return $sce.trustAsHtml( input ) );
}
}
所以我能够让它与 someVar | linky | nl2br
一起工作。问题出在 linky 过滤器上。 ngSanitize 的 linky 过滤器将 \r 和 \n 分别更改为
和
。给定的 nl2br 过滤器无法捕捉到这些。
感谢这个要点 https://gist.github.com/kensnyder/49136af39457445e5982 , 修改 nl2br 如下
angular.module('myModule')
.filter('nl2br', ['$sanitize', function($sanitize) {
var tag = (/xhtml/i).test(document.doctype) ? '<br />' : '<br>';
return function(msg) {
// ngSanitize's linky filter changes \r and \n to and respectively
msg = (msg + '').replace(/(\r\n|\n\r|\r|\n| | | | )/g, tag + '');
return $sanitize(msg);
};
}]);
工作fiddlehttp://jsfiddle.net/fxpu89be/4/
然而,它仍然没有解决以相反顺序使用它的原始问题,即 someVar | nl2br | linky