fix(@schematics/angular): use the generated class name when declaring in an NgModule #34448

Merged
meakib opened 7:46pm on October 20, 2026 wanted to merge 7 Ξ” into angular/angular-cli main from
fix/ng-module-declaration-class-name

Pull Request Overview

  • Opened on October 20, 2026
  • Status Merged
  • Commit count 1 with first commit October 20, 2026

Total Delta

7 Total Diff Delta

Open Days

Open 19 weekdays

Test Delta

0 Diff Delta in Test Files
Breakdown by Phase

How long has this pull request spent in each phase of its lifecycle?

Fraction of total time Business days Phase
N/A 0.0 days Issue creation to work beginning
 
0.0 days Authoring 1 commit before pull request opened for review
 
0.0 days Awaiting first review
 
0.5 days Revising work with 0 commits in response to 2 reviews that left 2 comments
 
17.9 days Merge to deploy (still awaiting deployment)

Total time for pull request 0.5 business days from first commit authored to merge
Still awaiting deployment

Author avatar

fix(@schematics/angular): use the generated class name when declaring in an NgModule

With addTypeToClassName: false, the component and directive schematics name the class without
the type, but the NgModule declaration was added with the type appended (e.g. FooComponent),
so the module no longer compiled.

Honour addTypeToClassName when computing the declared symbol.

Fixes #34447

Command

generate

Is this a regression?

  • [x] Yes, this behavior used to work in the previous version

The previous version in which this bug was not present was

The addTypeToClassName option was added in 21.0.0, and the declaration code was not updated, so it never worked.

Description

When a component or directive is generated into an NgModule with addTypeToClassName: false and a type set, the generated class and the symbol added to the NgModule don't match:

  • The component/directive class is named without the type (e.g. Widget), as configured.
  • The NgModule declarations (and exports with --export) import the name with the type (e.g. WidgetComponent), so the build fails.

This is the configuration that ng new --no-standalone --file-name-style-guide=2016 writes to angular.json:

"@schematics/angular:component": { "type": "component", "addTypeToClassName": false },
"@schematics/angular:directive": { "type": "directive", "addTypeToClassName": false }

The component and directive schematics compute the class name with addTypeToClassName (packages/schematics/angular/component/index.ts, packages/schematics/angular/directive/index.ts), but the shared addDeclarationToNgModule helper always appends the type:

// packages/schematics/angular/utility/add-declaration-to-ng-module.ts
const classifiedName =
  strings.classify(options.name) + (options.type ? strings.classify(options.type) : '');

Minimal Reproduction

ng new ws --no-standalone --file-name-style-guide=2016 --defaults
cd ws
ng generate component widget --module app
ng build

Generated src/app/widget/widget.component.ts:

export class Widget {}

Updated src/app/app.module.ts:

import { WidgetComponent } from './widget/widget.component';

@NgModule({
  declarations: [App, WidgetComponent],

The same happens for ng generate directive ... --module.

Exception or Error

✘ [ERROR] TS2305: Module '"./widget/widget.component"' has no exported member 'WidgetComponent'. [plugin angular-compiler]
✘ [ERROR] NG1010: Value at position 1 in the NgModule.declarations of AppModule is not a reference

Your Environment

Angular CLI       : 22.2.3
Node.js           : 24.15.0
Package Manager   : npm 11.12.1
Operating System  : darwin arm64
@schematics/angular : 22.2.3

Anything else relevant?

  • Introduced together with addTypeToClassName in e417c89f9e (#31053, v21.0.0). The same code is on 21.2.x and 22.2.x.
  • Suggested fix: let addDeclarationToNgModule use the class name computed by the calling schematic (or honour addTypeToClassName), so the declaration matches the generated class. Happy to send a PR with specs for the component and directive schematics.

Comments Threads Pending Resolution

gemini-code-assist[bot] reviewed on October 20, 2026
gemini-code-assist[bot] left a comment

## Code Review

This pull request adds support for generating component and directive class names without their type suffix when `addTypeToClassName` is set to `false`. This is implemented by updating the `DeclarationToNgModuleOptions` interface and the `addDeclarationToNgModule` utility, and is verified with new unit tests. Feedback on the changes points out a bug in the new component schematic test where the assertion expects `App` instead of `AppComponent` in the module declarations, which will cause the test to fail.

Resolved Comment Threads

alan-agius4 reviewed and approved this work on October 21, 2026
alan-agius4 left a comment

LGTM