Which @angular/* package(s) are the source of the bug?

core

Is this a regression?

No

Description

When a component uses model and output with names that would typically correspond (e.g., a model named value and an output named valueChange), the explicit output seems to override the implicit output of the model. This results in the model's value changes not being emitted.

Please provide a link to a minimal reproduction of the bug

https://4200-firebase-two-wb-conflict-1764841735310.cluster-uodogxybdfdkiqhne5y6pr6j4w.cloudworkstations.dev/

Please provide the exception or error you saw

Please provide the environment you discovered this bug in (run ng version)

Angular CLI       : 21.0.2
Angular           : 21.0.3
Node.js           : 20.19.1
Package Manager   : npm 10.8.2
Operating System  : linux x64

┌───────────────────────────┬───────────────────┬───────────────────┐
│ Package                   │ Installed Version │ Requested Version │
├───────────────────────────┼───────────────────┼───────────────────┤
│ @angular/build            │ 21.0.2            │ ^21.0.0           │
│ @angular/cli              │ 21.0.2            │ ^21.0.0           │
│ @angular/common           │ 21.0.3            │ ^21.0.0           │
│ @angular/compiler         │ 21.0.3            │ ^21.0.0           │
│ @angular/compiler-cli     │ 21.0.3            │ ^21.0.0           │
│ @angular/core             │ 21.0.3            │ ^21.0.0           │
│ @angular/forms            │ 21.0.3            │ ^21.0.0           │
│ @angular/platform-browser │ 21.0.3            │ ^21.0.0           │
│ @angular/router           │ 21.0.3            │ ^21.0.0           │
│ rxjs                      │ 7.8.2             │ ~7.8.0            │
│ typescript                │ 5.9.3             │ ~5.9.2            │
│ zone.js                   │ 0.15.1            │ ~0.15.0           │
└───────────────────────────┴───────────────────┴───────────────────┘

Anything else?

Steps to reproduce:

Create a component, MyComponent, with a model and an output that share the same base name. The model produces an input value and an output valueChange, and we will also create an output named valueChange.

// file: my-component.ts
import {Component, model, output} from '@angular/core';

@Component({
  selector: 'my-component',
  template: `
    <button (click)="value.set('model')">Model</button>
    <button (click)="valueChange.emit('output')">Output</button>
  `,
})
export class MyComponent {
  public readonly value = model<string>();
  public readonly valueChange = output<string>();
}

Create a parent component, App, that uses MyComponent and listens to the valueChange event.

// file: app.ts
import {Component, signal} from '@angular/core';
import { MyComponent } from './my-component';

@Component({
  selector: 'app-root',
  template: `
    <h1>{{ value() }}</h1>
    <my-component (valueChange)="value.set($event)" />
  `,
  imports: [MyComponent],
})
export class App {
  public readonly value = signal<string | undefined>('emitted value');
}

1. Run the application.
2. Click the "Model" button. Observe that the h1 tag's content does not change.
3. Click the "Output" button. Observe that the h1 tag's content changes to "output".

Expected behavior

It is expected that when the "Model" button is clicked, the value model's change is emitted, and the parent component's value signal is updated to 'model'. The behavior of the "Output" button is as expected.

Actual behavior

When the "Model" button is clicked, the model's value change is not emitted. The explicitly defined valueChange output seems to override the model's implicit valueChange output, preventing it from firing. If the public readonly valueChange = output<string>(); line and corresponding button is removed from my-component.ts, the "Model" button works as expected.