'Auto-format XML in Monaco Editor

I use the ngx-monaco-editor package in my Angular app to use Monaco Editor. I'm trying to set auto-formatting for XML content.

Component

@Component({
  selector: 'app-my-component',
  templateUrl: './my.component.html',
  styleUrls: ['./my.component.scss']
})
export class MyComponent implements OnInit {

  editorOptions = {
    language: 'xml',
    autoIndent: 'full',
    formatOnPaste: true,
    formatOnType: true,
    automaticLayout: true
  };
  code: string= '<parent><child></child></parent>';
...

Template

      <ngx-monaco-editor id="content" formControlName="content" class="editor"
                         [options]="editorOptions"
                         [(ngModel)]="code">
      </ngx-monaco-editor>

Actual Result

enter image description here

Expected Result

How to achieve the expected result?



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source