Repository: angular/angular
File: packages/core/src/change_detection/lifecycle_hooks.ts (TypeScript)

Code before:
 * Use of this source code is governed by an MIT-style license that can be
 * found in the LICENSE file at https://angular.dev/license
 */
import {SimpleChanges} from './simple_change';

/**
 * @description
 * A lifecycle hook that is called when the value of one or more component or directive inputs
 * change. This includes both signal-based and decorator-based inputs.
 * Define an `ngOnChanges()` method to handle the changes.
 *
 * @see {@link DoCheck}
 * @see {@link OnInit}
 * @see [Lifecycle hooks guide](guide/components/lifecycle)
 *
 * @usageNotes
 * The following snippet shows how a component can implement this interface to
 * define an on-changes handler for an input property. While you should prefer
 * `computed` and `effect` when working with signal-based inputs, the `ngOnChanges`
 * method does include value changes for signal-based inputs.
 *
 * ```ts
 * @Component({ ... })
 * export class UserProfile implements OnChanges {
 *   userId = input<number>(0);
 *   ngOnChanges(changes: SimpleChanges) {
 *     // changes.userId contains the old and new value.
 *   }
 * }
 * ```
 *
 * @publicApi
 */
export interface OnChanges {
  /**
   * A callback method that is invoked immediately after the
   * default change detector has checked data-bound properties
   * if at least one has changed, and before the view and content
   * children are checked.
   * @param changes The changed properties.
   */
  ngOnChanges(changes: SimpleChanges): void;
}

/**
 * @description
 * A lifecycle hook that is called after Angular has initialized
 * all data-bound properties of a directive.
 * Define an `ngOnInit()` method to handle any additional initialization tasks.
 *
 * @see {@link AfterContentInit}

Review comment (suggestion):
Would adding types for SimpleChanges be useful, or would it not apply in this case?
Something similar to what we have in the documentation.
https://angular.dev/guide/components/lifecycle#inspecting-changes

Code after:
 * Use of this source code is governed by an MIT-style license that can be
 * found in the LICENSE file at https://angular.dev/license
 */
import {SimpleChanges} from './simple_change';

/**
 * @description
 * A lifecycle hook that is called when the value of one or more component or directive inputs
 * change. This includes both signal-based and decorator-based inputs.
 * Define an `ngOnChanges()` method to handle the changes.
 *
 * @see {@link DoCheck}
 * @see {@link OnInit}
 * @see [Lifecycle hooks guide](guide/components/lifecycle)
 *
 * @usageNotes
 * The following snippet shows how a component can implement this interface to
 * define an on-changes handler for an input property. While you should prefer
 * `computed` and `effect` when working with signal-based inputs, the `ngOnChanges`
 * method does include value changes for signal-based inputs.
 *
 * ```ts
 * @Component({ ... })
 * export class UserProfile implements OnChanges {
 *   userId = input<number>(0);
 *   ngOnChanges(changes: SimpleChanges<UserProfile>) {
 *     // changes.userId contains the old and new value.
 *   }
 * }
 * ```
 *
 * @publicApi
 */
export interface OnChanges {
  /**
   * A callback method that is invoked immediately after the
   * default change detector has checked data-bound properties
   * if at least one has changed, and before the view and content
   * children are checked.
   * @param changes The changed properties.
   */
  ngOnChanges(changes: SimpleChanges): void;
}

/**
 * @description
 * A lifecycle hook that is called after Angular has initialized
 * all data-bound properties of a directive.
 * Define an `ngOnInit()` method to handle any additional initialization tasks.
 *
 * @see {@link AfterContentInit}