Как ссылаться на строку контроллера в HTML

Question

Я пытаюсь отобразить строку моего контроллера в src тега img, но да, мне не удается.

Вот мой код модели:

public class PigeonDetails
{
    [Key]
    public int PigeonID { get; set; }

    [Required]
    [Display(Name = "Ring Number")]
    public string RingNumber { get; set; }

    [Display(Name = "Pigeon Name")]
    public string Name { get; set; }

    [Required]
    [Display(Name = "Pigeon Color")]
    public string Color { get; set; }

    [Required]
    [Display(Name = "Gender")]
    public string Sex { get; set; }

    [Required]
    [Display(Name = "Year Type")]
    public int Year { get; set; }

    [Display(Name = "Description")]
    public string Description { get; set; }

    [Display(Name = "Date Added")]
    public DateTime DateAdded { get; set; }

    public string Image { get; set; }

}

Вот мой контроллер- Только метод, который я использую:

[HttpGet]
    // GET: PigeonDetails/Edit/5
    public async Task<IActionResult> Edit(int? id)
    {
        if (id == null)
        {
            return NotFound();
        }

        var pigeonDetails = await _context.PigeonDetails.SingleOrDefaultAsync(m => m.PigeonID == id);

        string placeholder = _context.PigeonDetails.Where(u => u.PigeonID == id).Select(u => u.Image).ToString();
        pigeonDetails.Image = placeholder;
        if (pigeonDetails == null)
        {
            return NotFound();
        }
        ViewData["ImagePath"] = pigeonDetails;
        return View(pigeonDetails);
    }

pigeonDetails.Image - это строка, хранящаяся в БД (путь к изображению - и она хранится правильно)

вот мой HTML:

  @{var image = (PigeonDetails)ViewData["ImagePath"];}

 <img src="@image.Image" id="profile" alt="user" class="img-responsive radius">

Он не отображает мое изображение на странице, пожалуйста, помогите.

Answer 1

Прежде всего, удалите строку placeholder, потому что pigeonDetails уже имеет ее, если соответствует идентификатору.Также существует проблема с .ToString() в IQueryable, поскольку он будет возвращать полное имя типа времени выполнения объекта, получившего вызов.

Во-вторых, Удалить бит ViewData.У вас уже есть модель для вашего представления (лучше, если вы вместо этого используете viewmodel).

Затем добавьте @model PigeonDetails поверх вашего представления, чтобы предоставить свойство Model для вашего представления.

Наконец, <img src="@Model.Image" />

Answer 2

Вот как бы я это сделал.Я удалил много ненужного кода.

Я немного подрезал ваш Edit метод действия:

[HttpGet]
public async Task<IActionResult> Edit(int? id)
{
     if (id == null)
     {
          return NotFound();
     }

     PigeonDetails pigeonDetails = await _context.PigeonDetails
          .Where(m => m.PigeonID == id)
          .SingleOrDefaultAsync();

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

     return View(pigeonDetails);
}

На странице просмотра Edit сделайте следующее:

@model YourNamespace.PigeonDetails

<img src="@Model.Image" id="profile" alt="user" class="img-responsive radius" />

Держитесь подальше от данных вида, предпочтительным и безопасным способом является использование модели вида.

Надеюсь, это поможет вам.

Answer 3

Можете ли вы попробовать эту

верхнюю страницу

@model ModelNameSpace.PigeonDetails

и ваш HTML-элемент

<img src="@Model.Image" id="profile" alt="user" class="img-responsive radius">

Пожалуйста, измените пространство имен.Это просто пример имени пространства имен;)