@ViewChild属性导致了奇怪的变化检测问题

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

我使用的是最新的角,以便创建一个应用程序,可以让你直接在浏览器中编辑代码最新MonacoEditor一起。我拥有了一切,直到今天伟大的工作,当我意识到我是用抢的DOM元素并绑定到MonacoEditor的@ViewChild元素被触发数百变化的检测周期的每一秒时悬停/点击的/ etc编辑器内。

我用这行来获取DOM元素上的手柄:

@ViewChild('editor') editor;

我的看法是这样的:

<div class="row">
    <div #editor style="min-height:600px"></div>
</div>

最后一点,以引导它在我的应用程序:

this._editor = monaco.editor.create(this.editor.nativeElement, {
    language: 'powershell'
});

只要下面的最后码跑和摩纳哥编辑器连接到应用程序,一下子消化周期数增加一吨。在编辑器中简单的鼠标移动事件引起变化的检测,我很快看到成千上万检测都发生在短短的几秒钟。当我删除代码的底线问题都赶不走。

我不得不解决这个问题的主要原因是不知何故这里的编辑器与另一个组件完全搞乱,造成变化检出做一些奇怪的事情是,在转导致的观点重新呈现在一遍又一遍。这重新渲染使我*ngFor循环,如果我曾经用一个函数来获取迭代的对象失败。

我已经在这个问题上几个小时被戳之前,我终于知道,原来是由摩纳哥编辑器造成的。我打与周围的ChangeDetectionRef类,但拆卸变化检测似乎并没有对任何编辑影响。

我是相当新的角的最新版本(最近从1.x中来),所以也许我只需要自举这个编辑器,以便它不这样做的一种特殊方式。我希望能够手动控制检测,但使用ChangeDetectionRef我还没有看到,在所有的工作至今

UPDATE

忘了提,我也尝试使用ChangeDetectionStrategy.OnPush以及帮助控制变化检测,它似乎没有任何效果可言上正在发生的基本检测。

angular monaco-editor
1个回答
1
投票

这可能是一个彻底的改变有点的,但你可以尝试https://github.com/atularen/ngx-monaco-editor这是摩纳哥编辑器中角的包装,而不是试图自己动手整合。

© www.soinside.com 2019 - 2024. All rights reserved.