Stop TSLint removing leading spaces within a HTML element

Question

How do I configure TSLint in VSCode to not reformat my code? I don't want to disable TSLint entirely I just want to stop this one thing it does. I want to keep the leading indentation within the html tags.

        <ng-template [ngIf]="($eventsCount | async) > 0">
            <a href=""
                *ngIf="!($isClosing | async)"
                class="btn--danger"
                confirm="Are you sure?"
                (confirmed)="onCloseAll()">
                Close All
            </a>
        </ng-template>

When I save the above code TSLint ( in VSCode ) reformats it to this:

        <ng-template [ngIf]="($eventsCount | async) > 0">
            <a href="" *ngIf="!($isClosing | async)" class="btn--danger" confirm="Are you sure?" (confirmed)="onCloseAll()">
                Close All
            </a>
        </ng-template>

What rule do I need to change in TSLint to stop it removing the leading spaces in my angular components html?

TSLint version: 5.9.1

Thanks

Answer 1

This is not TSLint - this is probably the default HTML formatter in VS Code. You likely have formatOnSave set to true, you can disable it completely, or for certain filetypes:

"editor.formatOnSave": true
  "[html]": {
    "editor.formatOnSave": false
}

However I would recommend checking out Prettier, they recently released an insanely powerful/configurable HTML formatter.