How to upload, Update and view multiple images in asp.net mvc core 6.0

Question

this is mine document model and here i created the documents with multiple images.

 public class DocumentModel
    {
    [Key]
    public int DocumentId { get; set; }
    [MaxLength(50, ErrorMessage = "Title cannot be more than 50")]
    public string Title { get; set; }

    [MaxLength(250, ErrorMessage = "Title cannot be more than 250")]
    [Display(Name ="Document Name")]
    public string DocumentName { get; set; }
      [Required]
    [Display(Name = "Document Creater Name")]
    public string DocumentCreaterName { get; set; }
    [Required]
    public string Discription { get; set; }

    [Required]
    [Display(Name ="Created date:")]
    public DateTime DocumentCreatedDate { get; set; }

    [Required]
    [Display(Name = "Modified date")]
    public DateTime DocumentModifiedDate { get; set; }

    [NotMapped]
    [Display(Name = "Upload File")]
    public List<IFormFile> DocumentFiles { get; set; }
    public string UserId { get; set; }

    [ForeignKey("UserId")]
    public virtual ApplicationUser User { get; set; }
}

This is my DocumentController

 public async Task<IActionResult> Create([Bind("DocumentId,UserId,Title,DocumentName,DocumentFiles,DocumentCreaterName,Discription,DocumentCreatedDate,DocumentModifiedDate")] DocumentModel documentModel)
        {
            if (ModelState.IsValid)
            {
                if (documentModel.DocumentFiles != null && documentModel.DocumentFiles.Count > 0)
                {
                    documentModel.UserId = User.FindFirstValue(ClaimTypes.NameIdentifier);
                    documentModel.DocumentCreatedDate = DateTime.Now;
                    //foreach (IFormFile document in documentModel.DocumentFiles)
                    //{
                        //for (int i = 0; i < documentModel.DocumentFiles.Count; i++)
                        //{
                            //save image to wwwRootPath
                            string wwwRootPath = _hostEnvironment.WebRootPath;
                           List<string> uploadedFiles = new List<string>();

                    foreach (IFormFile document in documentModel.DocumentFiles)
                        {

                            string file = Path.GetFileName(document.FileName);
                            string extension = Path.GetExtension(document.FileName);
                            documentModel.DocumentName = file = file + DateTime.Now.ToString("yymmssfff") + extension;
                            string path = Path.Combine(wwwRootPath + "/Image/", file);
                            using (var fileStream = new FileStream(path, FileMode.Create))
                            {
                             uploadedFiles. Add(file);
                            await document.CopyToAsync(fileStream);
                            }
                        }
                    
                    //insert records
                    //}
                    _context.Add(documentModel);
                    await _context.SaveChangesAsync();
                    TempData["AlertMessage"] = "Document Created Successfully....!!!!";
                        return RedirectToAction(nameof(Index));
                }
            }
            return View(documentModel);
        }

Multiple images will be uploaded to the wwwrootpath "images" but how to view multiple images in details of this controller. this is mine detail in controller:

public async Task<IActionResult> Details(int? id)
        {

            if (id == null)
            {
                return NotFound();
            }

            var documentModel = await _context.Documents
                .FirstOrDefaultAsync(m => m.DocumentId == id);
            if (documentModel == null)
            {
                return NotFound();
            }

            return View(documentModel);
        }

this is my detail view: where multiple file should be displayed but it shows only single file but all images are saved to the wwwRoot "Images". this is my detail full view:

<h1>Details</h1>

<div>
    <hr />
    <dl class="row">
        <dt class = "col-sm-2">
            @Html.DisplayNameFor(model => model.Title)
        </dt>
        <dd class = "col-sm-10">
            @Html.DisplayFor(model => model.Title)
        </dd>
        <dt class = "col-sm-2">
            @Html.DisplayNameFor(model => model.DocumentName)
        </dt>
        <dd class = "col-sm-10">
            @Html.DisplayFor(model => model.DocumentName)
        </dd>
        <dt class = "col-sm-2">
            
            @Html.DisplayNameFor(model => model.DocumentCreaterName)
        </dt>
        <dd class = "col-sm-10">
            @Html.DisplayFor(model => model.DocumentCreaterName)
        </dd>
        <dt class = "col-sm-2">
            @Html.DisplayNameFor(model => model.Discription)
        </dt>
        <dd class = "col-sm-10">
            @Html.DisplayFor(model => model.Discription)
        </dd>
        <dt class ="col-sm-2">
            @Html.DisplayNameFor(model=>model.DocumentCreatedDate)
        </dt>
        
        <dd class = "col-sm-10">
            @Html.DisplayFor(model => model.DocumentCreatedDate)
        </dd>

        <dd class = "col-sm-10">
        
      @foreach(var DocumentName in Model.DocumentName)
                {
                <img src="@("~/image/"+Model.DocumentName)" asp-append-version="true" width="250px" height="250px"/>
                }

            
                
        </dd>
        
    </dl>
   
</div>