client/src/app/shared/shared-forms/select/select-channel.component.ts

   1 import { Component, forwardRef, Input, OnChanges } from '@angular/core'
   2 import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms'
   3 import { VideoChannel } from '@app/shared/shared-main'
   4 import { SelectChannelItem } from '../../../../types/select-options-item.model'
   5
   6 @Component({
   7   selector: 'my-select-channel',
   8   styleUrls: [ './select-shared.component.scss' ],
   9   templateUrl: './select-channel.component.html',
  10   providers: [
  11     {
  12       provide: NG_VALUE_ACCESSOR,
  13       useExisting: forwardRef(() => SelectChannelComponent),
  14       multi: true
  15     }
  16   ]
  17 })
  18 export class SelectChannelComponent implements ControlValueAccessor, OnChanges {
  19   @Input() items: SelectChannelItem[] = []
  20
  21   channels: SelectChannelItem[] = []
  22   selectedId: number
  23
  24   // ng-select options
  25   bindLabel = 'label'
  26   bindValue = 'id'
  27   clearable = false
  28   searchable = false
  29
  30   ngOnChanges () {
  31     this.channels = this.items.map(c => {
  32       const avatarPath = c.avatarPath
  33         ? c.avatarPath
  34         : VideoChannel.GET_DEFAULT_AVATAR_URL()
  35
  36       return Object.assign({}, c, { avatarPath })
  37     })
  38   }
  39
  40   propagateChange = (_: any) => { /* empty */ }
  41
  42   writeValue (id: number) {
  43     this.selectedId = id
  44   }
  45
  46   registerOnChange (fn: (_: any) => void) {
  47     this.propagateChange = fn
  48   }
  49
  50   registerOnTouched () {
  51     // Unused
  52   }
  53
  54   onModelChange () {
  55     this.propagateChange(this.selectedId)
  56   }
  57 }