在Angular中本地安装MathJax

问题描述

我已按照帖子MathJax in Angular 6?中提供的步骤进行操作。

我设法使它起作用。我的问题是我想将引用从CDN更改为本地安装的MathJax

我已经使用npm install mathjax --save
我的 angular.json 文件中有

{
  "glob": "**/*","input": "node_modules/mathjax","output": "mathjax"
}

最后，我试图将对 MathModule 中的CDN的引用更改为以下内容，但它不起作用

@NgModule({
  declarations: [MathDirective],imports: [
    CommonModule
  ],exports: [MathDirective]
})
export class MathModule {
  constructor() {
    // see https://docs.mathjax.org/en/latest/advanced/dynamic.html
    const script = document.createElement('script') as HTMLScriptElement;
    script.type = 'text/javascript';
    script.src = '/mathjax/es5/tex-mml-chtml.js?config=TeX-MML-AM_CHTML';
    // script.src = 'https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/MathJax.js?config=TeX-MML-AM_CHTML';
    script.async = true;

    document.getElementsByTagName('head')[0].appendChild(script);

    const config = document.createElement('script') as HTMLScriptElement;
    config.type = 'text/x-mathjax-config';
    // register notifier to StartupHook and trigger .next() for all subscribers
    config.text = `
    MathJax.Hub.Config({
        skipStartupTypeset: true,tex2jax: { inlineMath: [["$","$"]],displayMath:[["$$","$$"]] }
      });
      MathJax.Hub.Register.StartupHook('End',() => {
        window.hubReady.next();
        window.hubReady.complete();
      });
    `;

    document.getElementsByTagName('head')[0].appendChild(config);
  }

  // this is needed so service constructor which will bind
  // notifier to window object before module constructor is called
  public static forRoot(): ModuleWithProviders<any> {
    return {
      ngModule: MathModule,providers: [{provide: MathService,useClass: MathService}]
    };
  }
}

如果我使用CDN链接，这将完美显示。下面

在我的TS文件中

  mathLatex: MathContent = {
    latex: 'When $a \\ne 0$,there are two solutions to $\\frac{5}{9}$'
  };

和HTML ...

<div [appMath]="mathLatex"></div>

产生

如何使用已安装的MathJax？

我当前尝试使用script.src = '/mathjax/es5/tex-mml-chtml.js?config=TeX-MML-AM_CHTML';的操作在控制台中不会产生任何错误，但不会呈现等式

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

angular angular javascript mathjax