Code-Editor

Mit der Code-Editor-Komponente können Sie den Microsoft Monaco-Editor in Ihren Dashboards hosten.

Erstellen eines Code-Editors

Sie können einen neuen Code-Editor mit dem Cmdlet New-UDCodeEditor erstellen. Wenn Sie den Parameter -Language angeben, wird die Syntaxhervorhebung für diese Sprache aktiviert. Sie müssen eine Höhe in Pixeln angeben.

New-UDCodeEditor -Height '500' -Language 'powershell'

Code befüllen

Verwenden Sie den Parameter -Code, um Code anzugeben, der beim Laden des Code-Editors darin befüllt wird.

New-UDCodeEditor -Height '500' -Language 'powershell' -Code '#Hello, world!'

Code aus einer anderen Komponente abrufen

Sie können Code aus einer anderen Komponente abrufen, indem Sie das Cmdlet Get-UDElement verwenden und auf die Code-Eigenschaft der zurückgegebenen Hashtable zugreifen.

New-UDCodeEditor -Height '500' -Language 'powershell' -Code '#Hello, world!' -Id 'editor'

New-UDButton -Text 'Get Code' -OnClick {
    Show-UDToast -Message (Get-UDElement -id 'editor').Code
}

Code aus einer anderen Komponente festlegen

Sie können Code aus einer anderen Komponente mit dem Cmdlet Set-UDElement festlegen. Geben Sie den Code-Wert in einer Hashtable an, die an den Parameter -Properties übergeben wird.

New-UDCodeEditor -Height '500' -Language 'powershell' -Code '#Hello, world!' -Id 'editor'

New-UDButton -Text 'Get Code' -OnClick {
    Set-UDElement -Id 'editor' -Properties @{
        code = "# Hello!"
    }
}

Optionen

Der Monaco-Editor unterstützt eine breite Palette von Optionen. Wenn Sie Optionen verwenden möchten, die im Cmdlet New-UDCodeEditor nicht verfügbar sind, können Sie den Parameter -Options verwenden und stattdessen eine Hashtable mit Optionen übergeben.

Eine vollständige Liste der Optionen finden Sie in der Schnittstelle IEditorConsturctionOptions.

New-UDCodeEditor -Language powershell -Height 100 -Options @{ fontSize = 10 }

API

• New-UDCodeEditor