GeezerVison

The World Wide Web, restored to 800 pixels of glory.

GeezerVison is showing angular.dev — model • Angular

API

Initializes a model of type T with an initial value of undefined. Angular will implicitly use undefined as initial value.

@returnsModelSignal<T | undefined>

Initializes a model of type T with the given initial value.

@paraminitialValueT

@paramoptsModelOptions | undefined

@returnsModelSignal<T>

Initializes a required model.

Users of your directive/component need to bind to the input side of the model. If unset, a compile time error will be reported.

@paramoptsModelOptions | undefined

@returnsModelSignal<T>

Usage Notes

To use model(), import the function from @angular/core.

import {model} from '@angular/core';

Inside your component, introduce a new class member and initialize it with a call to model or model.required.

@Directive({
  ...
})
export class MyDir {
  firstName = model<string>();            // ModelSignal<string|undefined>
  lastName  = model.required<string>();   // ModelSignal<string>
  age       = model(0);                   // ModelSignal<number>
}

Inside your component template, you can display the value of a model by calling the signal.

<span>{{firstName()}}</span>

Updating the model is equivalent to updating a writable signal.

updateName(newFirstName: string): void {
  this.firstName.set(newFirstName);
}

You are visitor 01402503 — GeezerVison does not store the pages you look up.
Best viewed with Netscape Navigator 4.7 or Internet Explorer 6 at 800×600. No cookies required.