Question

我使用MathJax的javascript库版本2.6.1和Angular 1.4应用程序。我有一个页面，我有多个标签，我称之为相同的指令，它在标签上调用MathJax.Hub.Queue（＆＃34; Typeset＆＃34;，MathJax.Hub，elem [0]）。似乎第一个项目的角色卡在预处理状态（灰色预览文本）上，并且没有完全处理到最终形式。

在页面加载时，我也调用MathJax.Hub.Queue（＆＃34; Typeset＆＃34;，MathJax.Hub，document.body）然后它工作正常。从AngularJS加载标签时，第一个标签卡在预处理状态。

Answer 1

自从我找到解决方案后回答我自己的问题：

我花了几个小时调试MathJax代码，似乎没有什么不对。我猜测MathJax的队列实现与AngularJS的范围观察效果不佳。将MathJax.Hub.Queue("Typeset", MathJax.Hub, elem[0])放入$timeout(fn, 0)。

后，我就可以修复它

固定指令最终看起来像这样：

angular.module('xpl.widget').directive('mathjaxBind', mathjax);

/* ngInject */
function mathjax($timeout) {
    return {
        priority: 100,
        restrict: "A",
        link: {
            post: postLink
        }
    }

    // ## postLink
    function postLink(scope, elem, attrs) {
        MathJax.Hub.Config({
            "HTML-CSS": {
                styles: {
                    ".MathJax_Display": {
                        "overflow-x": "auto"
                    }
                }
            }
        });
        scope.$watch(attrs.mathjaxBind, function (newVal, oldVal, scope) {
            // Add $timeout to MathJax Typesetting due to bug where first result wasn't getting queued properly. 
            $timeout(function() { 
                MathJax.Hub.Queue(["Typeset", MathJax.Hub, elem[0]]);
            }, 0);
        });
    }

}

为什么MathJax字符有时不起作用或卡在AngularJS中？

1 个答案: