Ace editor options creates an exception

[Jiehong]

Hi,

I've been trying to use the example to alter the Ace Editor options with the following:

  ngAfterViewInit(): void {
    const aceEditor = (<any>window).ace.edit(document.querySelector('#a' + this.editor.id + '>div'));
    // custom your ace here
    aceEditor.setReadOnly(true);
    aceEditor.setFontSize('110pt');
    this.options.ace = aceEditor;
    this.editor.setOptions(this.options);
  }

However, when this is evaluated, I get the following error:

TypeError: undefined is not a function (evaluating '_ace.edit(this.editorDom)') (line 187) (so edit is not a defined function here it seems).

At first I thought it was because ngAfterViewInit would evaluate too early, so I tried with using a button to manually trigger this, but I get the same error.

This has been tested with:

"ang-jsoneditor": "1.6.1",
"jsoneditor": "5.19.2",
"@angular/xx": "6.1.1"

I suppose you could easily reproduce by calling the setAce function in the unit-test of https://github.com/mariohmol/ang-jsoneditor/blob/master/src/app/demo/demo.component.ts.

[mariohmol]

I think u have to include ace.. no?

<script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.2.6/ace.js"></script>

[Jiehong]

ah, I didn't see this bit. I'd have expected it to be included in jsoneditor directly.

Let me try :D

[Jiehong]

Well, doesn't seem to work better, actually.

[mariohmol]

To be honest i could never get fully how this ace works with jsoneditor and how to customize this..

if you could help out..