Input Service - IRobot1/ng3-vr-examples GitHub Wiki

Used by flat-ui controls that implement the UIInput interface.

The 4 input methods only need to be declared once in your scene or app. Only declare what you need to use. These controls interact with the input service to close and open the appropriate control and ensure that only one is displayed at a time.

<flat-ui-list *ngIf="input.showlist" [list]="input.list" [selectedtext]="input.method.text"
              [position]="input.position" [rotation]="input.rotation" [scale]="scale" [selectable]="selectable"
              (change)="input.method.text = $event.text;input.showlist=false" (close)="input.showlist=false;input.closeinput()">
</flat-ui-list>

<flat-ui-color-picker *ngIf="input.showpicker" [colorvalue]="input.method.text"
                      [position]="input.position" [rotation]="input.rotation" [scale]="scale" [selectable]="selectable"
                      (colorpicked)="input.method.text = $event" (close)="input.showpicker=false;input.closeinput()">
</flat-ui-color-picker>

<flat-ui-keyboard *ngIf="input.showkeyboard" [text]="input.method.text"
                  [position]="input.position" [rotation]="input.rotation" [scale]="scale" [selectable]="selectable"
                  (change)="input.method.text = $event" (close)="input.showkeyboard=false;input.closeinput()">
</flat-ui-keyboard>

<flat-ui-numpad *ngIf="input.shownumpad" [text]="input.method.text"
                [position]="input.position" [rotation]="input.rotation" [scale]="scale" [selectable]="selectable"
                (change)="input.method.text = $event" (close)="input.shownumpad=false;input.closeinput()">
</flat-ui-numpad>

Add FlatUIInputService as a provider in your component and inject into the constructor

@Component({
  changeDetection: ChangeDetectionStrategy.OnPush,
  providers: [FlatUIInputService],
})

  constructor(
    public input: FlatUIInputService,
  ) { }