model()
Declares a two-way bindable signal input/output pair.
Syntax
model<T>(defaultValue?, options?) | model.required<T>(options?)Parameters
| Name | Type | Required | Description |
|---|---|---|---|
defaultValue | T | No | Initial value when the parent does not bind. |
options | object | No | Supports an alias. |
Returns
ModelSignal<T> — A writable signal that also emits a matching <name>Change event on set/update.
Examples
import { Component, model } from '@angular/core';
@Component({
selector: 'app-toggle',
standalone: true,
template: `<button (click)="checked.set(!checked())">{{ checked() }}</button>`,
})
export class ToggleComponent {
checked = model(false);
}
// parent template, two-way binding
// <app-toggle [(checked)]="isOn" />
Notes
model() creates a writable signal that is bindable with the banana-in-a-box
syntax. Writing to it (set/update) automatically emits the implicit
`<name>Change` output so the parent stays in sync. Use model.required() to
force the parent to provide a binding.