Issue
I am developing a project using Angular 14
. I want to add mathlive
in my project. It is 100% match for one of my requirement. I tried multiple sources to find some information for implemention/integration in my project but nothing is working. It would be great if anyone can guide.
I have tried below steps provided on [https://cortexjs.io/mathlive/guides/integration/#npm][1]
Added mathlive using
npm install --save mathlive
.Added below code in my ts file:
import { MathfieldElement } from 'mathlive';const mfe = new MathfieldElement();
There is no any further step provided in the official documentation for adding this in template.
Solution
Finally I was able to figure out the solution. Below are the steps:
Import mathlive
import { MathfieldElement, Mathfield } from 'mathlive';
.Add
ngAfterViewInit
hook in your component and add below code:
ngAfterViewInit(): void {
let mfe = new MathfieldElement();
// Set initial value and options
mfe.value = "\\frac{\\sin(x)}{\\cos(x)}";
// Options can be set either as an attribute (for simple options)...
mfe.setAttribute('virtual-keyboard-layout', 'dvorak');
// ... or using `setOptions()`
mfe.setOptions({
virtualKeyboardMode: 'manual',
});
// Attach the element to the DOM
let mathLiveDiv = document.getElementById("mathLive");
mathLiveDiv.appendChild(mfe);}
Answered By - Chetan Purohit
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.