John Papa

VS Code Angular Snippets

John Papa -

Visual Studio Code Beta is available and it supports extensions! I published my first 2 extensions for creating Angular 1 and 2 snippets. You can grab these from the marketplace or right from VS Code.

You can browse the VS Code Extension Gallery both from within VS Code and through the VS Code Marketplace.

###Installing

Angular 2 TypeScript Snippets for VS Code

This extension for Visual Studio Code adds snippets for Angular 2 for TypeScript.

Installation
  1. Install Visual Studio Code 0.10.1 or higher
  2. Launch Code
  3. From the command palette Ctrl-Shift-P (Windows, Linux) or Cmd-Shift-P (OSX)
  4. Select Install Extension
  5. Choose the extension
  6. Reload Visual Studio Code

Usage

Type part of a snippet, press enter, and the snippet unfolds.

ng2component  // creates an Angular 2 component
ng2service    // creates an Angular 2 service

Alternatively, press Ctrl+Space (Windows, Linux) or Cmd+Space (OSX) to activate snippets from within the editor.

Angular 1 TypeScript and JavaScript Snippets for VS Code

This extension for Visual Studio Code adds snippets for Angular 1 for TypeScript and JavaScript.

Installation
  1. Install Visual Studio Code 0.10.1 or higher
  2. Launch Code
  3. From the command palette Ctrl-Shift-P (Windows, Linux) or Cmd-Shift-P (OSX)
  4. Select Install Extension
  5. Choose the extension
  6. Reload Visual Studio Code

Usage

Type part of a snippet, press enter, and the snippet unfolds.

ng1controller // creates an Angular controller
ng1directive  // creates an Angular directive
ng1factory    // creates an Angular factory
ng1module     // creates an Angular module
ng1service    // creates an Angular service

Alternatively, press Ctrl+Space (Windows, Linux) or Cmd+Space (OSX) to activate snippets from within the editor.