Monaco 编辑器隐藏起来,直到我打开我的开发工具

问题描述 投票:0回答:1

我有一个 HTML 文件,其中集成了摩纳哥编辑器。但最初当我加载页面时,编辑器似乎被卡住了。只有当我打开我的开发工具时,编辑器才开始工作,如果我不打开我的开发工具,它就会卡住。这是我正在使用的 HTML 代码:

                        <div class="condition-label">Condition</div>
                        <ngx-monaco-editor 
                        [ngClass]="{'error-border' : errorMessage.emptyExpression}"
                        [value]="userInput.textChange" 
                        [options]="options" 
                        [(ngModel)]="userInput.textChange" 
                        (onInit)="onInit()"
                        ></ngx-monaco-editor>
                        <ngx-loading [show]="monacoLoader"></ngx-loading>
                        <div *ngIf="errorMessage?.emptyExpression" class="error-on-empty-condition"><nile-icon name="info" size="14px" color="var(--nile-colors-red-700)"></nile-icon>This field cannot be left blank</div>
                       
                    </div>

这是我的 TS 选项代码:

public options = {
        theme : 'vs',
        language : 'javascript',
        fontSize: "14px",
        wordWrap: 'on',
        lineNumbers: "on",
        minimap: {
            enabled: false
        }
    }
    monacoLoader = false;

    onInit(){
        this.monacoLoader = false;
    }
    logger(){
        this.monacoLoader = false;
        this.cdr.detectChanges();
    }

我不明白为什么会发生这种情况。有什么解决办法吗?

angular typescript monaco-editor visual-studio-monaco
1个回答
0
投票

你说你有一个 HTML 文件。从本地 HTML 文件加载进行测试时,JavaScript 将不会启动,除非您打开开发工具控制台。

如果这是一个问题,您可以在本地提供文件,就像使用 Web 服务器一样。为此有几种工具。我使用

python
php
网络服务器。

python3 -m http.server

php -S localhost:8000

然后就可以用浏览器查看页面了。

htmlview http://localhost:8000
© www.soinside.com 2019 - 2024. All rights reserved.