2

MVC.画像といくつかのデータを保存したのですが、保存した画像を表示できません。保存したすべての画像をメイン ページに表示したい。

モデル: モデルからデータベース リストを取得します

public List<Products> GenreList()
        {
}

コントローラ

public ActionResult MYsample()
{
    var MyList = storeDB.GenreList();
    var a= MyList.Count;

    if (a != null)
    {
        foreach (var li in MyList)
        {
            return File(li.fileContent, li.mimeType,li.fileName);
        }
    }
    return View(MyList);
}

意見

    @foreach (var item in Model)
    {
            <img src="@Url.Action("MYsample", "HomeController", new { id = item.ProductID })" alt="@item.Productname" />
    }
4

1 に答える 1

8

応答ストリームに画像を提供するコントローラーアクションを作成することから始めることができます。

public ActionResult Image(int id)
{
    // you should add a method to your repository that returns the image 
    // record from the id
    Products image = storeDB.Get(id);
    return File(image.fileContent, image.mimeType);
}

次に、メインコントローラーアクションで画像のリストをビューに送信します。

public ActionResult MySample()
{
    var model = storeDB.GenreList();
    return View(model);
}

次に、強く型付けされたビューで画像をループし、そのプロパティを新しく作成されたコントローラーアクションにポイントする<img>ことで、各画像のタグを生成します。src

@model MyList
@foreach (var li in MyList)
{
    <img src="@Url.Action("Image", new { id = li.Id })" alt="" />
}

データベースにクエリを実行し、IDから画像レコードを取得する個別のコントローラーアクションが必要ない場合は、を使用できますdata URI scheme。ただし、これはすべてのブラウザでサポートされているわけではないことに注意してください。

つまり、コントローラーアクションが画像データをビューに送信するという考え方です。

public ActionResult MySample()
{
    var model = storeDB.GenreList();
    return View(model);
}

<img>次に、強く型付けされたビュー内で、リストをループして適切なタグを生成できます。

@model MyList
@foreach (var li in MyList)
{
    <img src="src="data:@(li.mimeType);base64,@(Html.Raw(Convert.ToBase64String(li.fileContent)))" alt="" />
}
于 2013-02-05T09:23:33.877 に答える