ngx-MathJax 重新渲染指令無法重新渲染

Question

我目前正在嘗試呈現動態 MathJax 內容：

<div mathjax #math>
    $$Weight = {{ mass }} * {{ g }}$$
</div>

這工作正常，直到我在更改某些變量后嘗試重新渲染。 因此，例如，如果我改變了質量，那么我希望上面 HTML 中的值也會改變。

為此，我需要對 MathJax 指令的實例執行MathJaxTypeset()調用，因此按照ngx-mathjax github 頁面上的說明：

我使用 viewchild 來獲取頁面上的實例...

@ViewChild('math', { static: false, read: MathJaxDirective }) mathsExpressions?: MathJaxDirective;

然后在需要更新時對它們運行 MathJaxTypeset()...

makeNewValues(): void {
    this.mathsExpressions.MathJaxTypeset();
}

但是，這會產生錯誤...

ERROR TypeError: Cannot read properties of undefined (reading 'MathJaxTypeset')

我在指令的使用和操作方面沒有經驗，因此不確定我如何以及為什么會出現錯誤。 如果似乎無法找到要排版的實例，我認為問題出在 viewchild 中。

已經嘗試過

SO 上的大部分內容似乎與 AngularJS 相關或不特定於 ngx-angular，但SO 上的這個線程似乎是相同的問題。 然而，該解決方案並沒有為我自己的代碼改變任何東西。

app.module.ts

在我的 app.module.ts 我有：

MathJaxModule.forRoot({
    version: '2.7.5',
    config: 'TeX-AMS_HTML',
    hostname: 'cdnjs.cloudflare.com'
})

Answer 1

該庫的 GitHub 存儲庫（不再維護）列出了類似的問題： https : //github.com/davidshen84/ngx-mathjax/issues/10#issue-525662151沒有明確的解決方案。

您可以直接將MathJax用作腳本，而不是通過ngx-mathjax ，盡管似乎有替代方法mathjax-angular 。 快速查看源代碼，該庫為您創建了head script元素，因此可能值得一試：