import { Component } from '@angular/core' ; import { UploadState , UploadxControlEvent , UploadxOptions } from 'ngx-uploadx' ; import { environment } from '../../environments/environment' ; import { AuthService } from '../auth.service' ; @ Component ( { selector : 'app-directive-way' , templateUrl : './directive-way.component.html' } ) export class DirectiveWayComponent { control ! : UploadxControlEvent ; state ! : UploadState ; uploads : UploadState [ ] = [ ] ; options : UploadxOptions = { allowedTypes : 'image/*,video/*' , endpoint : `${ environment . api }/files?uploadType=uploadx` , token : this . authService . getAccessToken ( ) , maxChunkSize : 1024 * 1024 * 8 , storeIncompleteHours : 24 , retryConfig : { maxAttempts : 30 , maxDelay : 60000 , shouldRetry : ( code , attempts ) => { return code === 503 || ( ( code < 400 || code >= 501 ) && attempts < 5 ) ; } } } ; constructor ( private authService ) { } cancel ( uploadId ? ) { this . control = { action : 'cancel' , uploadId } ; } pause ( uploadId ? ) { this . control = { action : 'pause' , uploadId } ; } upload ( uploadId ? ) { this . control = { action : 'upload' , uploadId } ; } onStateChanged ( state ) { this . state = state ; const target = this . uploads . find ( item => item . uploadId === state . uploadId ) ; target ? Object . assign ( target , state ) : this . uploads . push ( state ) ; } }