Overview Version History Q & A Rating & Review
Angular TypeScript Snippets suitable for V19
Comprehensive Angular v19 snippets for TypeScript and HTML, including support for the latest Angular features.
This extension was created to bridge the gap in resources for Angular’s newest capabilities, most existing code snippets are quite outdated.
Features
This extension for VSCode adds snippets for the most common angular code. Adds snippets for:
Standalone as default for directive, components, pipes...
Signals (effect(), computed(), linkedSignal(), resource/rxResource(), input(), output())
New Control flow (@if, @else, @for, @switch)
Deferrable Views (@defer, @placeholder, @loading)
Usage
Type part of a snippet, press enter, and the snippet unfolds.
Alternatively, press Ctrl+Space (Windows, Linux) or Cmd+Space (macOS) to activate snippets from within the editor.
Requirements
If you have any requirements or dependencies, add a section describing those and how to install and configure them.
TypeScript Angular Snippets
Snippet
Purpose
component
standalone component
directive
standalone directive
pipe
standalone pipe
effect
Angular effect function
computed
Angular computed signal
linkedSignal
Angular linkedSignal
resource
Angular resource
rxResource
Angular rxResource
inputRequired
Angular required input signal
inputOptional
Angular optional input signal
output
Angular output signal
HTML Angular Snippets
Snippet
Purpose
@if
Angular @if statement
@if-else
Angular @if @else statement
@for
Angular @for statement
@switch
Angular @switch statement
@defer
Angular @defer statement
Inspired by johnpapa snippets.
Updated February 2025
Enjoy!