Vscode-ng-language-service: bug(language-service) using ngForTemplate (sugarized) with inline-template will mess-up html lint/format

Created on 4 Jun 2020 · 6Comments · Source: angular/vscode-ng-language-service

🐞 bug report

Affected Package

?language service?

(I hope its the right repo to put this)

Is this a regression?

I think: no, not 100% sure

Description

Steps to reproduce:

copy this into *.ts in vscode

@Component({
  selector: 'my-app',
  template: `
    <ng-container *ngFor="let el of [1,2,3,4]; template: myTpl">
    </ng-container>

    <ng-template let-el #myTpl>
      <p> {{el}} </p>
    </ng-template>

    <hr>

    <ng-template ngFor let-item="$implicit" [ngForOf]="[11,22,33,44]" [ngForTemplate]="myTpl"></ng-template>
  `,
  styleUrls: [ './app.component.css' ]
})
export class AppComponent  {}

(Stackblitz does not use language feature in inline tpl)

STACKBLITZ

When I use this in vscode its messes up the HTML linting/ styling.

🔥 Exception or Error

Messed up html

what it should look like (ignore red error line. There is no templateLOL input)

🌍 Your Environment

vscode Version: 1.45.1
Angular Language Service angular.ng-template 0.901.9

Angular Version:


Package                            Version
------------------------------------------------------------
@angular-devkit/architect          0.901.6
@angular-devkit/build-angular      0.901.6
@angular-devkit/build-ng-packagr   0.901.7
@angular-devkit/build-optimizer    0.901.6
@angular-devkit/build-webpack      0.901.6
@angular-devkit/core               9.1.6
@angular-devkit/schematics         9.1.6
@angular/cdk                       9.2.4
@angular/cli                       9.1.6
@angular/flex-layout               9.0.0-beta.31
@angular/material                  9.2.4
@ngtools/webpack                   9.1.6
@schematics/angular                9.1.6
@schematics/update                 0.901.6
ng-packagr                         9.1.5
rxjs                               6.5.5
typescript                         3.8.3
webpack                            4.42.0

Current workaround

use of "de-sugarized" version will not mess with linting/ formating.

<ng-template ngFor let-item="$implicit" [ngForOf]="[11,22,33,44]" [ngForTemplate]="myTpl"></ng-template>

bug extension

Source