outputs

Enumerates the set of event-bound output properties.

When an output property emits an event, an event handler attached to that event the template is invoked.

The outputs property defines a set of directiveProperty to bindingProperty configuration:

• directiveProperty specifies the component property that emits events.

• bindingProperty specifies the DOM property the event handler is attached to.

@Directive(
  selector: 'interval-dir',
  outputs: const ['everySecond', 'five5Secs: everyFiveSeconds'])
class IntervalDir {
  final everySecond = new EventEmitter<String>();
 
  final five5Secs = new EventEmitter<String>();
 
  IntervalDir() {
    setInterval(() => everySecond.emit("event"), 1000);
    setInterval(() => five5Secs.emit("event"), 5000);
  }
}
 
@Component(
  selector: 'app',
  template: '''
    <interval-dir (everySecond)="everySecond()" (everyFiveSeconds)="everyFiveSeconds()">
    </interval-dir>
  ''',
  directives: const [IntervalDir])
class App {
  everySecond() { print('second'); }
  everyFiveSeconds() { print('five seconds'); }
}