我正在尝试创建一个自定义过滤器来去除我选择菜单上的 HTML。这是我尝试过的,但它不起作用。
<select
ng-options="item.name for item in list | htmlToPlaintext">
<option value="">Select</option>
</select>
它正在渲染空值。
app.filter('htmlToPlaintext',
function () {
return function (items) {
var filtered = [];
angular.forEach(items, function (item) {
var stripped = String(item).replace(/<[^>]+>/gm, '');
filtered.push(stripped);
});
return filtered;
}
});
有人将这种类型的过滤器应用于 Angular 中的 ng-options 吗?
您需要修改您的过滤器(如下所示)以及您的 html 片段。您可以应用过滤器,而不是整个项目,而是每个标题。
下面是演示:
angular.module('selectFilters', ['filters']);
angular.module('filters', []).filter('htmlToPlaintext', function() {
return function(text) {
return String(text).replace(/<[^>]+>/gm, '');
}
});
function ItemCtrl($scope, $filter){
$scope.Items = [
{ID: '000001', Title: '<b>Chicago</b>'},
{ID: '000002', Title: '<b><i>New York</i></b>'},
{ID: '000003', Title: '<div><p>Washington</p></div>'}
];
}
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="selectFilters">
<div ng-controller="ItemCtrl">
<div>
<select ng-model="item" ng-options="(item.Title | htmlToPlaintext) for item in Items"></select>
</div>
</div>
</div>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)