2016-09-01 3 views
0

Ich habe den Monaco-Editor (https://github.com/Microsoft/monaco-editor) als eine Möglichkeit für den Benutzer eingeführt, einige JSON einfügen.Reset Monaco Editor-Status

Ich aktivieren den Editor, sobald der Benutzer auf eine Schaltfläche "Post" klickt. Das Problem ist, dass der Editor innerhalb einer Switch-Funktion aktiviert ist. Wenn der Benutzer also einmal auf die Schaltfläche geklickt hat, wird der Editor gerne an den ersten erstellten Editor angehängt, wenn der Kunde erneut auf dieselbe Schaltfläche klickt. Gibt es eine Möglichkeit, den Editor "zurückzusetzen", also wird er nicht wirklich anhängen, sondern stattdessen entweder einen neuen erstellen oder den bereits erstellten verwenden?

Hier ist mein aktueller Code.

require.config({ paths: { 'vs': '/scripts/monaco-editor/min/vs' } }); 

switch (id) { 
     case 'post': 
      $('#httpMethodGet').css('display', 'none'); 
      $('#httpMethodPost').show(); 
      require(['vs/editor/editor.main'], function() { 
       monaco.languages.json.jsonDefaults.setDiagnosticsOptions({ 
        schemas: [{ 
         uri: "http://myserver/bar-schema.json", 
         schema: { 
          type: "object", 
          properties: { 
           q1: { 
            enum: ["x1", "x2"] 
           } 
          } 
         } 
        }] 
       }); 
       var jsonObject = [ 
        '{', 
        ' "$schema": "http://myserver/foo-schema.json"', 
        "}" 
       ].join('\n'); 
       window.editor = monaco.editor.create(document.getElementById('codeEditor'), { 
        value: jsonObject, 
        language: 'json', 
        theme: 'vs-dark', 
        scrollBeyondLastLine: false, 
        renderWhitespace: true 
       }); 
      }); 
      break; 

Deshalb mag ich die window.editor = monaco.editor.create(document.getElementById('codeEditor'), {}) entweder auf das gleiche verwendet bereits erstellt, wenn es eine erstellt ist, oder einen neuen machen, jedes Mal dieser Schalter Fälle eingegeben werden, so dass es hängt kein Gebrüll der eine (s) bereits erstellt.

Antwort

0

Sie sollten den Monaco-Code-Editor außerhalb Ihrer Switch-Funktion erstellen. Innerhalb Ihrer Funktion sollten Sie nur Ihr Modell ändern.

Also vor dem switch() Funktion

window.editor = monaco.editor.create(document.getElementById('codeEditor'), { 
        value: '', 
        language: 'json', 
        theme: 'vs-dark', 
        scrollBeyondLastLine: false, 
        renderWhitespace: true 
       }); 

dann in switch()

window.editor.getModel(). setValue(jsonObject); 

APIs sind avalable here.

+0

Ich fand eine Lösung und dachte mir, dass ich den monaco.editor bis dahin sowieso nicht benutzen konnte, also wechselte ich zu CodeMirror. Danke für deine Antwort - von dem, was ich mich erinnere, sieht das wie eine sehr gültige Lösung aus :-) – Daniel