因此,我一直在尝试使用MathJax在Angular 4应用程序上渲染数学方程式。一切工作正常,直到我不得不渲染单个方程式为止。但是现在我需要渲染大约4个来自API的方程式。

现在,在ngFor中使用MathJax仅适用于数组中的第一个对象,但不适用于此对象。请参见下面的屏幕截图:

javascript - 在ngFor Angular(2/4/5)中使用MathJax-LMLPHP

我的HTML看起来像这样:

<div class="card">
    <div class="card-header">
        //question HTML
    </div>
    <div *ngFor="let answer of model.question?.options">
        <span class="answers" #answers>{{answer?.text}}</span>
    </div>
</div>


并且,该组件如下所示:

@ViewChild('equation') equation: ElementRef;

MathJax.Hub.Queue(["Typeset", MathJax.Hub, this.equation.nativeElement]);
MathJax.Hub.Queue(["Typeset", MathJax.Hub, this.answers.nativeElement]);

最佳答案

尝试:

<div class="card">
    <div class="card-header">
        //question HTML
    </div>
    <div *ngFor="let answer of model.question?.options">
        <span class="answers">{{answer?.text}}</span>
    </div>
</div>




@ViewChild('equation') equation: ElementRef;

MathJax.Hub.Queue(["Typeset", MathJax.Hub, this.equation.nativeElement]);
MathJax.Hub.Queue(["Typeset", MathJax.Hub, document.getElementsByClassName("answers")]);


'#sintaxis是唯一的。

关于javascript - 在ngFor Angular(2/4/5)中使用MathJax,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/47515186/

10-11 02:08