directive-event.md

API > Interfaces

DirectiveEvent

Description

An interface that is used when dispatching events using ChangeDirective, ClickDirective, DisplayDirective, FocusDirective, and TrackValidationDirective.

Properties

Property	Desciption
id: string	A useful identifier for the event.
label?: string	optional An easier to read description of the event.
scopes?: []	optional A list of scopes to include with the event.

Example

In this example an DirectiveEvent is built in the Angular component's ngOnInit() and then used by the oculrDisplay directive. The objects in scopes are completely customizable and determined by consuming applications.

import { DirectiveEvent } from 'oculr-ngx';

@Component({
  template: `<div [oculrDisplay]="bannerEvent">Important banner message</div>`,
})
export class MyComponent implements OnInit {
  bannerEvent: DirectiveEvent;

  ngOnInit() {
    this.bannerEvent = {
      id: 'bannerMessage',
      label: 'Display important banner message',
      scopes: [{
        // the following properties are for example only
        test: 'messagePosition'
        experience: 'A'
      }]
    };
  }
}

Feedback

Is something not working or unclear? Please create an issue or PR.