AngularJS Controller to Component Migration

What it does and when to use it

Convert AngularJS controllers into Angular components during modernization. Use when controller-heavy views must become component-based before or during a hybrid migration.

How it works

1. Purpose
2. When to Use
3. When Not to Use
4. Required Inputs
5. Procedure
6. Do
7. Do Not
8. Review Checklist
9. Expected Output
10. Exit Criteria

---
id: angular.upgrade.angularjs.angularjs-controller-to-component-migration
name: AngularJS Controller to Component Migration
description: >
  Convert AngularJS controllers into Angular components during modernization. Use when controller-heavy views must become component-based before or during a hybrid migration.
stack:
  - Angular
  - AngularJS
category: angularjs
status: stable
version: 0.11.0
owner: NgAutoPilot
triggers:
  - AngularJS controller migration
  - controller to component
  - legacy controller
compatibility:
  angular:
    min: "2"
---

# AngularJS Controller to Component Migration

## Purpose

Migrate AngularJS controllers to Angular components.

## When to Use

- Controllers own view logic that should move to components.
- The app is being modernized incrementally.

## When Not to Use

- The controller is not part of the migration scope.
- The app is already component-first.

## Required Inputs

- controller code
- template bindings
- scope usage

## Procedure

1. Extract controller state and methods.
2. Move template logic into Angular component inputs and outputs.
3. Validate behavior.

## Do

- Keep component APIs simple.
- Preserve user-visible behavior.

## Do Not

- Do not keep scope-based coupling.

## Review Checklist

- [ ] Controller responsibilities identified.
- [ ] Component API defined.
- [ ] Tests updated.

## Expected Output

1. Controller migration summary.
2. Component mapping.

## Exit Criteria

- Controllers are no longer required for the migrated view.

Versions

The database has no other skills named AngularJS Controller to Component Migration.

Identical content appears in 1 other GitHub folders. We show one copy with the highest score.

Database snapshot: 13.11.2026 · package version 95e7121de091 (SHA-256 digest of the entire package)

Downloads in the last 30 days: 0 · ranking

Report a problem with this skill: harmful content, incorrect descriptions or an author’s removal request.

Similar skills

• 100angular-migration
  Migrate from AngularJS to Angular using hybrid mode, incremental component rewriting, and dependency injection updates. Use when upgrading AngularJS applications, planning framework migrations, or modernizing legacy Angular code.
• 100angular-migration
  Migrate from AngularJS to Angular using hybrid mode, incremental component rewriting, and dependency injection updates. Use when upgrading AngularJS applications, planning framework migrations, or modernizing legacy Angular code.
• 100angular-migration
  Migrate from AngularJS to Angular using hybrid mode, incremental component rewriting, and dependency injection updates. Use when upgrading AngularJS applications, planning framework migrations, or modernizing legacy Angular code.
• 100angular-migration
  Migrate from AngularJS to Angular using hybrid mode, incremental component rewriting, and dependency injection updates. Use when upgrading AngularJS applications, planning framework migrations, or modernizing legacy Angular code.
• 100angular-migration
  Migrate from AngularJS to Angular using hybrid mode, incremental component rewriting, and dependency injection updates. Use when upgrading AngularJS applications, planning framework migrations, or ...
• 80AngularJS Filter to Pipe Migration
  Replace AngularJS filters with Angular pipes or component logic during migration. Use when template filters hide presentation rules that should become explicit Angular behavior.