smithery.ai

angular-coding

Angular coding standards with version-aware patterns. Automatically detects Angular version from package.json and applies appropriate patterns. Use when writing Angular components, services, or TypeScript code.

First seen Apr 10, 2026

Installation

$ npx skills add https://smithery.ai

Similar popular skills

Related neighbors and high-traction skills in the same topics — useful to compare before installing.

Also in this package

Other skills from smithery.ai · top by installs.

npx skills add https://smithery.ai

Browse all from smithery.ai

More details

Agent compatibility

Declared targets from SKILL.md / docs. Unmarked agents are not listed — the skill may still install via the CLI.

Claude Code Not declared
Cursor Not declared
Codex Not declared
GitHub Copilot Not declared
Windsurf Not declared
Gemini CLI Not declared
Cline Not declared
OpenCode Not declared

Package contents

Files included with this skill beyond the listing page.

  • skill md SKILL.md 2,895 B
  • docs SUMMARY.md 232 B

History

  1. First seen on skills.sh
  2. First recorded snapshot · 1 installs

SKILL.md

Angular Coding Standards

Version-aware Angular development patterns.

Pre-Edit Analysis

Trước khi edit Angular code, read: → C:\Users\BLogic\.cursor\skills\project-scanner\SKILL.md

Quality gates cho high-risk edits (change signature, shared service, delete/rename).

Setup

Step 0: Scan Existing Patterns (Nếu project có code)

Trước khi tạo mới, scan project để follow convention đang dùng:

Glob: **/*.service.ts → Xem service pattern
Glob: **/*.component.ts → Xem component pattern  
Glob: **/*.model.ts → Xem model/interface pattern
Grep: FormGroup → Xem form pattern

Step 1: Detect Angular Version

Read package.json and find @angular/core version:

"@angular/core": "^17.0.0"  // → v17
"@angular/core": "~15.2.0"  // → v15

Step 2: Load Appropriate Patterns

Based on detected version, read the relevant files:

Version Files to Read
v13-14 base.md + module-based.md
v15-16 base.md + standalone.md + signals.md (preview)
v17 base.md + standalone.md + signals.md + control-flow.md
v18-19+ base.md + standalone.md + signals.md + control-flow.md + advanced-v18-19.md

Quick Reference

Naming Conventions (All Versions)

Type Convention Example
Signal Prefix $ $user, $state
Observable Suffix $ isLoading$, data$
Private Prefix _ destroyed$, load()

Core Principles

Priority Principle Guideline
🥇 Angular-native first 95% dùng Angular built-in (reactive forms, validators, pipes, directives). 5% custom code khi Angular không hỗ trợ
🥈 Performance OnPush, signals, object mapping > array loop, minimal subscriptions
🥉 Readability Simple code, dễ đọc, dễ sửa cho dev khác. OOP + SOLID

Decision Flow

Có vấn đề cần giải quyết?
    ↓
Angular có built-in? (FormControl, Pipe, Directive, Validator...)
    ├─ YES → Dùng Angular (95%)
    └─ NO  → Tạo custom với SOLID pattern (5%)

File Index

  • [base.md](base.md) - Common patterns all versions
  • [module-based.md](module-based.md) - NgModule patterns (v13-14)
  • [standalone.md](standalone.md) - Standalone components (v15+)
  • [signals.md](signals.md) - Signals API (v16+)
  • [control-flow.md](control-flow.md) - @if/@for/@defer (v17+)
  • [advanced-v18-19.md](advanced-v18-19.md) - Signal inputs, linkedSignal (v18+)