Leave a Comment
AngularJS: директива для вставки html выполнением всех скриптов
Допустим, мы получаем с сервера код вида
|
1 2 3 |
<script>alert(1234)</script><script type="text/javascript">alert(12345)</script> <script type="asdf">alert(1234)</script><script src="/js/alert.js">alert(1234)</script> <span style="color: red;">1234</span> |
и хотим его вывести в шаблоне.
Для обычного вывода с парсингом html-тегов достаточно
|
1 |
<div ng-bind-html="ad.html | trustAsHtml"></div> |
Но, к примеру, jQuery умеет выполнять все скрипты, которые есть в строке ad.html.
AngularJS такого из коробки не умеет.
Поэтому была написана директива bind-html-with-js, используется она также:
|
1 |
<div ng-bind-html="ad.html | trustAsHtml"></div> |
При этом все скрипты, и инлайновые, и внешние, будут выполнены, а их код в div вставлен не будет.
Код на гитхаб — https://github.com/bullgare/ng-directive-bind-html-with-js.
Пример использования:
JS Bin
http://jsbin.com/UXIMEmi/1/edit
Что почитать дальше/на чём основан:
код angular.js (функция jsonpReq)
http://stackoverflow.com/questions/2592092/executing-script-elements-inserted-with-innerhtml
http://code.jquery.com/jquery-1.10.2.js
Similar Posts
LEAVE A COMMENT
Для отправки комментария вам необходимо авторизоваться.