我尝试在Angular 6上构建类似freecodecamp的东西并将其添加到我的项目monaco code editor中,但是现在我只能保存代码,不能运行。
我希望能够将代码执行的结果保存到变量中,以便比较正确答案和答案以及用户编写的内容。
我认为我可以使用WebWorkers来执行该代码,但是如何?
组件模板:
<ngx-monaco-editor
[options]="editorOptions"
[(ngModel)]="code">
</ngx-monaco-editor>
<button
(click)="clickSave()"
color="primary"
mat-raised-button>
Save
</button>
和班级:
import {
ChangeDetectionStrategy,
Component,
Input,
OnInit,
} from '@angular/core';
@Component({
selector: 'app-code-editor',
templateUrl: './code-editor.component.html',
styleUrls: ['./code-editor.component.sass'],
changeDetection: ChangeDetectionStrategy.OnPush,
})
export class CodeEditorComponent implements OnInit {
@Input() theme: string;
@Input() language: string;
public editorOptions;
public code = ``;
ngOnInit(): void {
this.fillEditorOptions();
}
public clickSave(): void {
localStorage.code = JSON.stringify(this.code);
}
private fillEditorOptions(): void {
this.editorOptions = {
theme: this.theme,
language: this.language,
};
}
}