跳轉到

影片選擇器

影片選擇器支援編輯與檢視兩種模式

Import 相依

import { UofxVideoSelectModule } from '@uofx/web-components/video-select';

使用方式

import { UofxVideoItemModel } from '@uofx/web-components/video-select';

video: Array<UofxVideoItemModel> = [];

ngModel

<uofx-video-select [editable]="true" [(ngModel)]="video"></uofx-video-select>

form

<uofx-video-select [editable]="true" formControlName="video"></uofx-video-select>

可用屬性

參數名稱 類型 預設值 說明
editable boolean null 是否可編輯
height number 344 預設四筆的高度 (86*4)

UofxVideoItemModel

/** 可選取的影片單筆資料 model */
export interface UofxVideoItemModel {
  /** 影片id */
  id: string;
  /** 切圖連結 */
  screenshotUrl: string;
  /** 影片名稱 */
  name: string;
  /** 狀態 */
  status: UofxVideoStatus;
  /** 修改者 */
  editor: UofxUserSetModel;
  /** 修改時間 */
  modifiedDate: string;
  /** 觀看次數 */
  viewCount?: number;
  /** 開放時間 */
  startDate?: string;
}
/** 影片狀態 */
export enum UofxVideoStatus {
  /** 已上架 */
  Active = 0,
  /** 待上架 */
  NotYetActive = 1,
  /** 已下架 */
  Inactive = 2,
}