фильтр углового ввода: используйте теги html

Я использую фильтр с угловым типом, чтобы добавить дополнительный элемент в список предложений типа:

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: plunkr

заранее спасибо.


angularjs angular-bootstrap angular-ui-typeahead
person Riz    schedule 03.11.2014    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Кажется, в ui-bootstrap 0.7.0 существует конфликт между фильтром подсветки шрифта и вашим собственным фильтром finalAppend.

Просто измените свой tpl.html на это:

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

И загрузите angular sanitize, чтобы предотвратить автоматическую ошибку безопасности, выдаваемую angular.

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

внедрить ngSanitize в свое приложение.

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

И это работает. Вот адрес плункера.

Однако, если вы все еще хотите использовать внутренний фильтр подсветки typeahead, вы можете изменить свой ui-bootstrap на это (уже изменил его в демоверсии):

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

Надеюсь, это сработает. Наслаждайся этим. :)

person Tyler.z.yang    schedule 03.11.2014