Экранирование HTML в пользовательской директиве

У меня есть пользовательская директива, которая отображает строки с помощью латекса с использованием MathJax.js, вот код.

MathJax.Hub.Config({
    skipStartupTypeset: true,
    tex2jax: {
      inlineMath: [['$','$'], ['\\(','\\)']],
      processEscapes: true
    }
});
MathJax.Hub.Configured();

angular.module('mathjaxModule', [])

.directive("mathjaxBind", function() {
    return {
        restrict: "A",
        controller: ["$scope", "$element", "$attrs", function($scope, $element, $attrs) {
            $scope.$watch($attrs.mathjaxBind, function(value) {
                $element.text(value == undefined ? "" : value);
                MathJax.Hub.Queue(["Typeset", MathJax.Hub, $element[0]]);
            });
        }]
    };
});

и вы используете это так: <span mathjax-bind="textToRender"></span>

Эта директива очень удобна, потому что я могу комбинировать текст с выражениями MathJax, и пока математические выражения находятся в пределах $$, все отображается нормально. Текст как текст и математические выражения с использованием MathJax.

Проблема в том, что некоторые из этих строк включают также HTML, и я не могу использовать ng-bind-html, когда использую свою пользовательскую директиву.

Я пробовал что-то вроде этого без успеха:

<span mathjax-bind="textToRender" ng-bind-html="textToRender"></span>

Может быть, я неправильно понимаю концепцию. Как я могу решить эту проблему?


javascript angularjs mathjax
person luigisrs    schedule 06.02.2015    source источник

Ответы (1)


arrow_upward
1
arrow_downward

У меня такая же потребность, и я нашел ответ здесь: http://blog.datacamp.com/mathjax-binding-in-angular-js/

Вот мой код:

.directive('mathjax',function(){
  return {
    restrict: 'A',
    link: function($scope, $element, $attrs) {
      $scope.$watch($attrs.ngBindHtml, function () {
        MathJax.Hub.Queue(['Typeset',MathJax.Hub,$element[0]]);
      });
    }
  };
});

Затем используйте его как: <span ng-bind-html="textToRender" mathjax></span>

person Yuer    schedule 13.06.2015