ctrl+shift+p filters: :st2 :st3 :win :osx :linux
Browse

Ngx HTML

by princemaple ST3

Ngx (Angular2+) HTML Syntax for SublimeText

Details

Installs

  • Total 31K
  • Win 18K
  • Mac 8K
  • Linux 6K
Dec 2 Dec 1 Nov 30 Nov 29 Nov 28 Nov 27 Nov 26 Nov 25 Nov 24 Nov 23 Nov 22 Nov 21 Nov 20 Nov 19 Nov 18 Nov 17 Nov 16 Nov 15 Nov 14 Nov 13 Nov 12 Nov 11 Nov 10 Nov 9 Nov 8 Nov 7 Nov 6 Nov 5 Nov 4 Nov 3 Nov 2 Nov 1 Oct 31 Oct 30 Oct 29 Oct 28 Oct 27 Oct 26 Oct 25 Oct 24 Oct 23 Oct 22 Oct 21 Oct 20 Oct 19 Oct 18
Windows 0 2 1 1 0 0 0 0 1 0 0 0 0 0 1 0 2 0 1 2 1 0 1 0 0 0 0 0 0 0 0 0 2 0 0 1 0 0 2 0 0 0 1 1 0 2
Mac 0 1 0 0 0 0 0 0 0 1 0 1 0 0 1 1 0 0 0 0 0 2 1 1 1 0 0 0 0 0 1 0 0 2 0 0 0 0 0 0 0 0 0 1 0 0
Linux 2 0 1 0 0 0 0 0 0 1 0 0 0 0 0 0 0 2 0 1 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 0 0 1 1 1 1

Readme

Source
raw.​githubusercontent.​com

Ngx (Angular2+) HTML Syntax for SublimeText

based on the official sublime html syntax

Features

So that it's not broken when there are

attributes on the tags

Plus

Highlighting the JS part as JS. So,

  • in [myBinding]="myVar", you should see myVar as an JS variable instead of string content
    • i.e. myVar should be highlighted differently from "s
  • in *ngFor="let column of columns", you should see let and of highlighted as keywords
  • in (change)="update()", you should see update as function name
  • in a && b within an Angular expression, you should see && correctly highlighted as the JS operator instead of an error you would see in normal HTML syntax.
  • in {{1 + 2}} interpolations, you should see JS syntax highlighting as well

How to use

The syntax is listed as Ngx HTML in Sublime syntax selection list.

I personaly use ApplySyntax plugin with the following setting:

"syntaxes": [
    {
        "syntax": "Ngx HTML/NgxHTML",
        "extensions": ["component.html"],
    },
]

You could use it in other ways… e.g. set it as the default syntax for all html files, since it's a superset of the html syntax anyway.