AngularJS2 template uses plug-WebStorm

Angular official documentation style guides mentioned template using the IDE to achieve a unified style, inside the IDE does not mention WebStorm, so the online search relevant information.

Install plug

Referring to WebStorm latest 2016 AngularJs 2 code hints plug-in installed .

Select the left webstorm Plugin option of setting or performance (macos), then click Browse repositories.

In the search box search Angular 2 TypeScript Live Templates, and then click Install, you will be prompted to restart webstorm, restart after installed.

If you set up a proxy on your computer, click on the lower left corner of the HTTP proxy settings, select auto-detect proxy settings, and then download it.

Use plug-ins

Angular 2 TypeScript Live Templates (Snippets) for WebStorm on github with instructions, I look at the instructions in this demo.

TypeScript Snippets

TypeScript plug-ins for the following instructions:

Big Box   AngularJS2 template plugin WebStorm uses body>

1 2 3 4 5 6 7 8

ng2-component-root // Angular 2 root App component ng2-bootstrap // Angular 2 bootstraping, for main.ts ng2-component // Angular 2 component ng2-pipe // Angular 2 pipe ng2-routes // Angular 2 @Routes ng2-route-path // Angular 2 routing path ng2-service // Angular 2 service ng2-subscribe // Angular 2 observable subscription

Instruction will be prompted to select the appropriate template command generates default.

HTML Snippets

Angular plug-in also prompted the following command:

1 2 3 4 5 6 7

ng2-ngClass ng2-ngFor ng2-ngIf ng2-ngModel ng2-routerLink ng2-ngStyle ng2-ngSwitch