Question

我使用带有角度预先类型的过滤器将额外的项目附加到预先输入建议列表上，如下所示：

app.filter('finalAppend', function($sce){
  return function(array, value){ 
    array.push({
    name: $sce.trustAsHtml('Look for <b>' + value + '</b> in other shops'),
    type: 'good'
    }); 
    return array;
  }
});

我想返回html编码的字符串，但angular会自动清理它。我按照建议尝试使用$ sce，但它似乎不起作用。这里是傻瓜：plunkr

提前感谢。

Answer 1

似乎在ui-bootstrap 0.7.0中，打印头高亮过滤器和你自己的finalAppend过滤器之间存在冲突。

只需将您的tpl.html更改为：

<div ng-if="match.model.type!=null">
    <span  ng-bind-html="match.label"></span>
</div>

并加载角度消毒以防止角度自动抛出安全错误。

<script src="http://code.angularjs.org/1.3.1/angular-sanitize.js"></script>

将ngSanitize注入您的应用。

var app = angular.module('myApp', ['ui.bootstrap', 'ngSanitize']);

它有效。 Here is the plunker address.

但是，如果您仍想使用typeahead内部精彩集锦过滤器，可以将ui-bootstrap更改为此（已在演示中更改它）：

<script src="//angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.11.2.js"></script>

希望这可行。好好享受。：）

angular typeahead过滤器：使用html标签

1 个答案: