Не може да се зареди изображение

Опитвам се да запазя стойността на пътя на изображението в променлива и да я предам на свойството img src, но не работи.

По-долу е моят код...

<div class="js-container-assortmentlist">
  @{
    string layoutImage1 = "FORMULE1UNTIL3_MOBIELETAFEL1_A_SIDE.jpg";
    string layoutImage2 = "FORMULE1UNTIL3_MOBIELETAFEL1_B_SIDE.jpg";
    string imageSource1 = "~/images/TafelLayouts/" + layoutImage1;
    string imageSource2 = "~/images/TafelLayouts/" + layoutImage2;    
  }

  <div style="width:30%; margin-left: auto;margin-right: auto;display:block " id="layoutImage1">
    <img class="" id="imgLayout" src="@imageSource1" alt="@layoutImage1">
  </div>
  <div style="width:30%; margin-left: auto;margin-right: auto;display:none " id="layoutImage2">
    <img class="" id="imgLayout" src="@imageSource2" alt="@layoutImage2">
  </div>
  <br />
</div>

Когато предоставям стойността за img src директно като "~/images/TafelLayouts/FORMULE1UNTIL3_MOBIELETAFEL1_A_SIDE.jpg", тя работи добре.

Тъй като трябва да заредя динамични изображения, трябва да предам тази стойност динамично.


javascript html css .net-core razor
person Nityananda Das    schedule 18.07.2019    source източник
comment
извикайте метод в src на изображение като src=‹%=getImagePath()%› и върнете пътя на вашето изображение от посочения js метод или отидете на Url Content или за динамична промяна на scr просто отидете на $(#imageid).src= пътя на вашия образ;   -  person Arunprasanth K V    schedule 18.07.2019

Отговори (1)


arrow_upward
0
arrow_downward

Трябва да използвате Url.Content, за да коригирате превода ~/

  @{
    string layoutImage1 = "FORMULE1UNTIL3_MOBIELETAFEL1_A_SIDE.jpg";
    string layoutImage2 = "FORMULE1UNTIL3_MOBIELETAFEL1_B_SIDE.jpg";
    string imageSource1 = Url.Content("~/images/TafelLayouts/" + layoutImage1);
    string imageSource2 = Url.Content("~/images/TafelLayouts/" + layoutImage2);    
  }

За да получите URL динамично, можете да създадете персонализиран UrlHelper на вашия проект

namespace project.MyCustomExtensions

public static class UrlHelperExtensions
  {
      public static string ImageUrl(this UrlHelper url, string param1, string param2)
      {
          // your logic goes here 
      }
  }

И го наричат ​​така

@using project.MyCustomExtensions // using on top of your view

// your html code

<img class="" id="imgLayout" src="@Url.ImageUrl("someParamValue", "otherParamValue")" alt="@layoutImage2">
person Cleiton Tortato    schedule 18.07.2019