AngularJS и дезинфицировать - Sanitize HTML без директивы ngBind

Question

Позволяет supose нам нужно дезинфицировать строку HTML и мы не можем использовать директиву нг-связывать-HTML, например:

<span data-toggle="tooltip" title="Edit {{customer.name}}">Text</span> 

Если у нас есть специальные символы в customer.name эта строка будет напечатана как html-версия, например é, и вместо этого мы хотим é.

я испытал с:

• $sce.trustAsHtml(customer.name)
• $sce.parseAsHtml(customer.name)

Но ничто не может "перевести" этот HTML. Как это можно сделать?

Короткое объяснение: как дезинфицировать html внутри директивы (не в теле с ng-bind-html).

Answer 1

С oficial documentation:

ngBindHtml использует $ sce.parseAsHtml (выражение привязки). Вот реальный код (немного упрощенно):

var ngBindHtmlDirective = ['$sce', function($sce) { 
    return function(scope, element, attr) { 
    scope.$watch($sce.parseAsHtml(attr.ngBindHtml), function(value) { 
     element.html(value || ''); 
    }); 
    }; 
}]; 

, так что я думаю, что все, что вам нужно, это $sce.parseAsHtml (https://docs.angularjs.org/api/ng/service/$sce#parseAsHtml).

---

Если вы не в состоянии убедить угловатых так или иначе напечатать HTML, вы можете попробовать использовать

customer.name.replace(/é/g, String.fromCharCode(233)); 

Вы можете найти некоторые основные коды здесь: http://www.javascripter.net/faq/accentedcharacters.htm

Это должно работать, но это не определенно лучшее решение. Вы всегда должны использовать ng-bind-html.

Answer 2

Это не должно быть так сложно.

Вместо этого используйте элементы setAttribute и textContent (V.S. innerHTML) на элементах, а сами браузеры позаботятся о вас для санитарии.

// To set element attributes 
$span.setAttribute("title", "Edit" + customer.name); 

// To set element content 
$span.textContent = customer.name; 

Для получения дополнительной информации см. the post here. Конечно, это одно время привязки, поэтому, если вам нужны обновления, просто бросьте $watch посредине.