MVC将mp3和图像列表放入表格中

Question

我已经插入了上传文件及其工作的代码，但问题是我想将图片上传到图片名称表，音乐表栏中的音乐，还有一件事是我没有从任何数据库获取目录文件夹会做。

这里是我的剃刀html我的所有文件都上传到目录中，是否有代码将.jpg扩展为图像列和mp3到mp3列？或者无论如何编码

<table>   
@foreach (var f in Directory.GetFiles(Server.MapPath(@ViewBag.UploadURL)))
    {
        var fileInfo = new FileInfo(f);

        ViewBag.FileNoExtension = fileInfo.Name.Substring(0, fileInfo.Name.IndexOf('.'));
        ViewBag.FileExtension = fileInfo.Name.Substring(fileInfo.Name.IndexOf('.') + 1);
        <tr>
           <td style = width = "10">@fileInfo.Name</td>
            @* <td>@ViewBag.FileNoExtension</td>*@
          <td><img width="50" height="50" src="@Url.Content(@ViewBag.UploadURL + "/" + fileInfo.Name)" /></td>


                <td>
                   @foreach(var a in Directory.GetFiles(Server.MapPath(@ViewBag.MusicURL)))
                        {  var fileInfoc = new FileInfo(a);
                                      //ViewBag.FileNoExtension = fileInfoc.Name.Substring(0, fileInfoc.Name.IndexOf('.'));
                                      ViewBag.FileExtensionc = fileInfoc.Name.Substring(fileInfoc.Name.IndexOf('.') + 1);                 

                       @fileInfoc.Name     
                         } 

                </td>
                }
                <td>            
                  @Html.ActionLink("Remove", "Remove", new { id = @ViewBag.StoryID, id2 = @ViewBag.FileNoExtension, id3 = @ViewBag.FileExtension })
                </td>

        </tr>
    } </table>

好的继承我的控制器

   [HttpPost]
    public ActionResult Upload(int id, IEnumerable<HttpPostedFileBase> ImageInput,IEnumerable<HttpPostedFileBase> MP3Input)
    {
        story story = db.stories.Find(id);
        ViewBag.StoryID = story.StoryID;

        ViewBag.MusicURL = "~/Upload/story/Music" + "/" + story.FileURL;
        ViewBag.ImageURL = "~/Upload/story/Image" + "/" + story.FileURL;

        CreateDirectory("~/Upload/story/Music" + "/" + story.FileURL);
        CreateDirectory("~/Upload/story/Image" + "/" + story.FileURL);


        String filepathMusic = "~/Upload/story/Music" + "/" + story.FileURL;
        String filepathImage = "~/Upload/story/Image" + "/" + story.FileURL;

        // get images jpg file only
        foreach (var imagefile in ImageInput)
        {
            if (imagefile != null)
            {
                string extension = Path.GetExtension(imagefile.FileName);
                var fileName = imagefile.FileName;
                var imagePath = Path.Combine(Server.MapPath(filepathImage), fileName);
                switch (extension)
                {
                  //  case ".mp3":
                    case ".jpg":
                         var f = Directory.GetFiles(Server.MapPath(filepathImage));

        var uploadedFiles = new List<String>();
        var files = Directory.GetFiles(Server.MapPath(filepathImage));


        foreach(var file2 in files)
        {
            var fileInfo = new FileInfo(file2);
            uploadedFiles.Add(fileInfo.Name);
            ViewBag.b = fileInfo;
        }
        imagefile.SaveAs(imagePath);

                        //Upload file as it is an image
                        break;
                    default:
                        //Not an image - ignore
                        break;
                }
               // return View("Upload");

                //file.SaveAs(imagePath);
            }
        }
        // get music files only

        foreach (var Musicfile in MP3Input)
        {
            if (Musicfile != null)
            {
                string extension = Path.GetExtension(Musicfile.FileName);
                var filemusic = Musicfile.FileName;
                var MusicPath = Path.Combine(Server.MapPath(filepathMusic), filemusic);
                switch (extension)
                {
                    case ".mp3":
                        var a = Directory.GetFiles(Server.MapPath(filepathMusic));

                        var uploadedFiles = new List<String>();
                        var filesc = Directory.GetFiles(Server.MapPath(filepathMusic));

                        foreach (var file3 in filesc)
                        {
                            var fileInfoc = new FileInfo(file3);
                            uploadedFiles.Add(fileInfoc.Name);
                            ViewBag.a = fileInfoc;
                        }
                        Musicfile.SaveAs(MusicPath);
                  //  case ".jpg":
                        //Upload file as it is an mp3
                        break;
                    default:
                        //Not an mp3 - ignore
                        break;
                }


                //file.SaveAs(imagePath);
            }
        }

Answer 1

我假设您有某种形式的通用命名来将图像与名称相关联。在这个例子中，我只是按顺序将图像分配给MP3文件。

1. 在控制器中做杂乱的工作，而不是你的观点。保持观点简单。
2. 将视图模型用于更接近视图需要的内容。
3. 让控制器完成将原始事实转换为视图模型的混乱工作。
4. Controller然后将视图模式传递给视图以显示它。

您的观点应该像这样简单：

@model IEnumerable<SomeWebApplication.Models.MusicItem>
<table class="display" id="example">
    <thead>
        <tr>
            <th>Image File</th>
            <th>MP3 File</th>
            <th>Remove</th>
        </tr>
    </thead>
    <tbody>
        @foreach (var item in Model)
        {
            <tr>
                <td><img width="50" height="50" src="@item.ImageUrl" /></td>
                <td><embed src="@item.MusicUrl" /></td>
                <td>@Html.ActionLink("Remove", "Remove", new { id = @item.Id })</td>
            </tr>
        }
    </tbody>
</table>

...它将一个MusicItems集合作为其视图模型

视图模型将如下所示：

public class MusicItem
{
    /// <summary>
    /// Unique id of item
    /// </summary>
    public int Id { get; set; }

    /// <summary>
    /// URL to image
    /// </summary>
    public string ImageUrl { get; set; }

    /// <summary>
    /// Url to music
    /// </summary>
    public string MusicUrl { get; set; }
}

您的控制器应该进行繁重的工作：

    public ActionResult Details(int id)
    {
        Story story = db.Stories.Find(id);

        // Use server relative paths for views
        String filepathMusic = "/Upload/story/Music/" + story.FileURL;
        String filepathImage = "/Upload/story/Image/" + story.FileURL;

        // Build a list of MusicItem objects
        List<MusicItem> items = new List<MusicItem>();
        string[] musicFiles = Directory.GetFiles(Server.MapPath("~" + filepathMusic));
        foreach (var musicFile in musicFiles)
        {
            items.Add(new MusicItem()
            {
                Id = id,
                MusicUrl = filepathMusic + "/" + Path.GetFileName(musicFile)
            });
        }

        // This example simply allocates the images in the order found - need to do this properly
        string[] imageFiles = Directory.GetFiles(Server.MapPath("~" + filepathImage));
        int index = 0;
        foreach (var imageFile in imageFiles)
        {
            if (index < items.Count)
            {
                items[index].ImageUrl = filepathImage + "/" + Path.GetFileName(imageFile);
            }
            index++;
        }

        return View(items);
    }

然后，假设你的故事中有2个图像和两个文件......

上面测试代码的最终结果如下：