Video not displaying after refreshing in angular - Stack Overflow

admin管理员组

文章数量:1208153

i am updating the video and image in my update form when image or video selected after updating page refresh but video not displaying if i go back and refresh and come updated video appearing (Angular 17) this is my code

updateVideo(dealId: number, event: any): void {
    if (dealId && event == null) {
      const formData = new FormData();
      formData.append('VideoFile', event);
      this.http.put(`https://localhost:5001/api/Deals/updatevideo?dealId=${dealId}`, formData)
        .subscribe({
          next: () => {
            setTimeout(() => {
              this.fetchDealData(dealId);
              window.location.reload();
            }, 3000);
            // alert('Video removed successfully.');
          },
          error: (err) => {
            console.error('Error removing video:', err);
            alert('Failed to remove video. Please try again.');
          }
        });
      console.log(dealId);
    }
    if (dealId && event != null) {
      const formData = new FormData();
      formData.append('VideoFile', event);
      this.http.put(`https://localhost:5001/api/Deals/updatevideo?dealId=${dealId}`, formData)
        .subscribe({
          next: () => {
            setTimeout(() => {
              this.fetchDealData(dealId);
              window.location.reload();
            }, 3000);
            // this.dealUpdateForm.patchValue({ videoUrl: '' });
            alert('Video Updated successfully.');
          },
          error: (err) => {
            console.error('Error updating video:', err);
            alert('Failed to update video. Please try again.');
          }
        });
      console.log(dealId);
    }
  }

these functions are working but i have go back refresh and comeagain to get the updated results

i have added interval once it has no time to fetch the updated details

here this is my html code to display video

<div class="mb-2 row align-items-center">
      <label for="dealVideo" class="col-sm-3">Deal Video</label>
      <div class="col-sm-9">
        <div>
          <video
            *ngIf="dealUpdateForm.get('videoUrl')?.value"
            [src]="api+dealUpdateForm.get('videoUrl')?.value"
            controls
            class="rounded"
            style="max-width: 2500px; max-height: 250px;"
            accept="video/*"

          ></video>
          <button *ngIf="dealUpdateForm.get('videoUrl')?.value" type="button" class="btn btn-link text-danger"  (click)="removeVideo(dealUpdateForm.get('id')?.value, null)">Remove</button>
        </div>
        <div>
          <input class="form-control" formControlName="videoUrl"  (change)="FileSelected(dealUpdateForm.get('id')?.value,$event)" type="file"  accept="video/*" />
        </div>
      </div>
    </div>

本文标签： Video not displaying after refreshing in angularStack Overflow