2017-02-23 33 views
0

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

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

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

я испытал с:

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

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

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

ответ

0

С 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(/&eacute;/g, String.fromCharCode(233)); 

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

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

+0

Да, я знаю это решение, заменяя работу wil всегда. Но мой вопрос заключается в использовании плагина ngSanitize для того, чтобы сделать саницию каждого html-символа (даже небезопасного) за пределами 'ng-bind-html', я имею в виду, где вы не можете использовать директиву, как в примере, который я показал. Спасибо за вашу помощь. –

+0

Я попробовал это решение, прежде чем спрашивать. Я выполнил функцию 'return $ sce.parseAsHtml (value)', но он не работал, а в HTML 'title =" Edit {{parseCode (customer.name)}} "'. –

1

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

Вместо этого используйте элементы 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 посредине.

+0

Да, это может быть решение, не так элегантное или угловатое решение. Он может генерировать много исходного кода в контроллере в зависимости от количества необходимых вам санитарных заданий, даже так много функций для модульности, которые учитывают масштаб и часы. это мое единственное решение, я полагаю, я должен принять его. Большое спасибо за вашу помощь. –