在角度6

时间:2018-12-19 06:19:57

标签: angular math angular6 mathquill

我已经使用 Mathquill界面为我的网站创建数学编辑器。

<!DOCTYPE html>
<html>
<head>
    <title>math</title>
    <link rel="stylesheet" type="text/css" href="http://mathquill.com/lib/mathquill.css">
    <link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/latest/css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/mathquill/0.10.1/mathquill.css">
</head>

<style type="text/css">
    p {
  margin-top: 40px;
}
#math-field {
  width: 500px;
  height: 200px;
}
.btn{
    width: 50px;
}
</style>
<body><center>
<span id="math-field"></span><br><br><br>
<div id="keyboard">

    <button type="button" class="btn btn-default" onClick='input("\\theta")'>θ</button>
    <button type="button" class="btn btn-default" onClick='input("\\tau")'>τ</button>
    <button type="button" class="btn btn-default" onClick='input("\\chi")'> χ</button>

</body>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script src="http://mathquill.com/lib/mathquill.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/mathquill/0.10.1/mathquill.js"></script>
<script type="text/javascript">
    var mathFieldSpan = document.getElementById('math-field');
    var MQ = MathQuill.getInterface(2);
    var mathField = MQ.MathField(mathFieldSpan, {
            spaceBehavesLikeTab: true,
            handlers: {
                edit: function() {
                mathField.focus();
                }
            }
        });
    const editor = new MathJaxEditorKeyboard('#myEditor')

    function input(str) {
      mathField.cmd(str);
      mathField.focus();

    }
</script>

</html>

此代码在 HTML 文件中可以正常工作。 我试图在有角度的应用程序中使用此代码,但是没有用。 请帮助使用 Angular 6

中的算术界面

0 个答案:

没有答案