@angular/core

output

초기화 API

안정화v19.0부터

The output function allows declaration of Angular outputs in directives and components.

You can use outputs to emit values to parent directives and component. Parents can subscribe to changes via:

template event bindings. For example, (myOutput)="doSomething($event)"
programmatic subscription by using OutputRef#subscribe.

API

output

OutputEmitterRef<T>

@paramoptsOutputOptions | undefined

@returnsOutputEmitterRef<T>

사용 시 참고사항

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

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

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

@Directive({
  ...
})
export class MyDir {
  nameChange = output<string>();    // OutputEmitterRef<string>
  onClick    = output();            // OutputEmitterRef<void>
}

You can emit values to consumers of your directive, by using the emit method from OutputEmitterRef.

updateName(newName: string): void {
  this.nameChange.emit(newName);
}

사용 시 참고사항

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

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

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

@Directive({
  ...
})
export class MyDir {
  nameChange = output<string>();    // OutputEmitterRef<string>
  onClick    = output();            // OutputEmitterRef<void>
}

You can emit values to consumers of your directive, by using the emit method from OutputEmitterRef.

updateName(newName: string): void {
  this.nameChange.emit(newName);
}