angular-migration

Migrate AngularJS applications to Angular with hybrid bootstrapping and component conversions.

5|Updated Aug 23, 2025
One-click install
npx skills add https://github.com/camoneart/claude-code --skill angular-migration
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: angular-migration
Source: https://github.com/camoneart/claude-code/tree/main/skills/angular-migration
Command: npx skills add https://github.com/camoneart/claude-code --skill angular-migration

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes assets (resource) and references (resource) components.

What problem does it solve?

Upgrading legacy AngularJS (1.x) applications to modern Angular (2+) is a significant undertaking, often requiring complex strategies to ensure a smooth transition. This Skill provides a comprehensive guide to incremental migration, hybrid app setups, and component conversion.

Core Features & Use Cases

  • Hybrid App Setup: Guides on running AngularJS and Angular side-by-side using ngUpgrade.
  • Component & Service Migration: Provides patterns for converting AngularJS controllers/directives to Angular components and services.
  • Dependency Injection & Routing: Explains how to migrate DI and routing systems between the two frameworks.
  • Use Case: If you have a large AngularJS application, this Skill helps you plan an incremental migration, allowing you to modernize feature by feature without a complete rewrite.

Quick Start

Example: Convert an AngularJS controller to an Angular component

"I have an AngularJS UserController. Show me how to convert it into a modern Angular component."

Claude will provide code examples for both the old controller and the new Angular component.

Frequently Asked Questions about angular-migration

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I migrate an AngularJS application to modern Angular?

Migrating AngularJS to Angular involves using ngUpgrade to run both frameworks side-by-side, converting controllers and directives to Angular components incrementally, and modernizing dependency injection and routing. This allows feature-by-feature rewriting without a complete rebuild.

Can I run AngularJS and Angular together during migration?

Yes, ngUpgrade enables hybrid bootstrapping where AngularJS and Angular coexist in the same application. You downgrade Angular components for AngularJS templates and upgrade AngularJS components for Angular views, allowing gradual migration.

How do I convert AngularJS controllers and directives to Angular components?

Convert AngularJS controllers to Angular component classes with inputs and outputs, replace directive logic with Angular component templates and lifecycle hooks, and bind services through dependency injection. This transforms legacy patterns into modern component architecture.

What's the best approach for migrating large AngularJS applications?

Incremental migration is the recommended approach—modernize one feature at a time using ngUpgrade's interop patterns. This reduces risk, maintains stability, and lets teams learn Angular patterns progressively rather than attempting a full rewrite.

How do I migrate AngularJS services to Angular?

Convert AngularJS services to Angular services by moving factory or service definitions into Angular's provider system, updating TypeScript typing, and using the injector to bridge dependencies between frameworks during hybrid operation.

What are the key differences in dependency injection between AngularJS and Angular?

AngularJS uses string-based injection; Angular uses TypeScript type annotations. ngUpgrade handles cross-framework DI interop, allowing upgraded Angular services to inject downgraded AngularJS services and vice versa during migration.