MathJax с угловой (5) и Firebase

Question

Я изучаю Angular 5, и я хотел бы извлечь некоторые данные из моей базы Firebase (готово), отобразить их на веб-странице (готово), а затем визуализировать математику с помощью MathJax.

Я включил MathJax в заголовок так:

<script type="text/x-mathjax-config">
MathJax.Hub.Config({
    tex2jax: {
        inlineMath: [['$','$'], ['\\(','\\)']],
        processEscapes: true
        }
});

Это прекрасно работает для статических данных, но когда я извлекаю некоторые данные из моей Firebase, они не отображаются. Я знаю о компонентах, но в остальном новичок в Angular. Может кто-нибудь помочь мне с тем, как я могу заставить MathJax рендериться после того, как AngularJS будет сделан, и, таким образом, это будет работать в реальном времени, когда данные в моем Firebase изменяются, пожалуйста?

Благодарю.

Answer 1

Вы используете разрешение обещаний? В вашем компоненте вы можете сделать, например:

.
.
.

declare var MathJax;

.
.
.

export class myComponent implements OnInit {

  firebaseDocRef = ...;
  myComponentProperty = ...;

  constructor() {}

  ngOnInit()
  {

    firebaseDocRef.get("key").then((data) =>
                           {
                             this.myComponentProperty = data;
                             MathJax.Hub.Queue(() => { MathJax.Hub.Typeset();});
                           });
  }

}