I've been using emmet with the Angular Framework in VS Code recently, and noticed that the emmet does not allow to generate the following abbreviations, because the attribute syntax is too limited. These examples should showcase all the problems:
Event Binding:
btn[(click)="DoSomething()"] should expand to <button (click)="DoSomething()"></button>
Attribute Binding:
div[[style.width]=100px] should expand to: <div [style.width]="100px"></div>
Two-way Binding:
input[[(ngModel)]=username] should expand to <input [(ngModel)]="username">
Structural Directive:
ng-template[*ngIf=show] should expand to <ng-template *ngIf="show"></ng-template>
Issues:
1, 2 and 3 fail because of the () and [] brackets in the attribute name
1 also fails because of the () brackets in "DoSomething()". [] and {} appear to work though. This is not limited to Angular, and also applies to the regular onclick-event with plain javascript for example.
2 also fails because of the dot in the attribute binding, but this should be a fairly rare case
4 fails because of the * at the start of the attribute name
I tried escaping with \, but I couldn't get any of the shown examples to work.
It would be really helpful for me if these issues could be fixed
I've been using emmet with the Angular Framework in VS Code recently, and noticed that the emmet does not allow to generate the following abbreviations, because the attribute syntax is too limited. These examples should showcase all the problems:
Event Binding:
btn[(click)="DoSomething()"]
should expand to<button (click)="DoSomething()"></button>
Attribute Binding:
div[[style.width]=100px]
should expand to:<div [style.width]="100px"></div>
Two-way Binding:
input[[(ngModel)]=username]
should expand to<input [(ngModel)]="username">
Structural Directive:
ng-template[*ngIf=show]
should expand to<ng-template *ngIf="show"></ng-template>
Issues:
()
and[]
brackets in the attribute name()
brackets in"DoSomething()"
.[]
and{}
appear to work though. This is not limited to Angular, and also applies to the regular onclick-event with plain javascript for example.*
at the start of the attribute nameI tried escaping with
\
, but I couldn't get any of the shown examples to work.It would be really helpful for me if these issues could be fixed