2017-02-18 3 views
0

Was ich versuche zu erreichen:LazyLoad mit ASP.NET Core - Relativer Root-Pfad?

Mit LazyLoad des data-original Attribute während ~/ Pfadkennung von ASP.NET zu halten für meinen relativ-Root-Pfad!

Was ist das Problem:

data-original Attribut konvertiert nicht mein ~/ in den relativen-Root-Pfad für meine Bilder

Ein normaler Bildpfad:

<img src="www/folder/file.png" /> 

ASP.NET Core-Pfad: Dies erfordert eine~/ASP.NET zu sagen, dass es von der Wurzel relativen Pfad wird

<img src="~/folder/file.png" /> 

LazyLoad das Bild

<img data-original="/folder/file.png" /> 

Hat jemand Erfahrung damit, dass der relative Root-Pfad mit LazyLoadsrichtig funktioniert?Attribut?

Ich habe bereits versucht, dies zu tun:

<img data-original="~/folder/file.png" /> 

Aber es funktioniert nicht

Antwort

0

ich allein die Antwort herausgefunden. Ich entschied mich dafür, meine eigene relative Root-Pfadvariable innerhalb eines Controllers zu erstellen und dann den Wert in die View zurückzugeben. Alles, was ich zu diesem Zeitpunkt tun musste, war die Variable mit Razor Markup einzufügen und fertig!

Meine Umwelt:

  • .NET-Core 1.1
  • ASP.NET Kern

Controller:

IHostingEnvironment Service hat zwei Eigenschaften von besonderem Interesse: ContentRootPath und WebRootPath. Für meine Zwecke, werde ich ContentRootPath verwenden, weil ich die relative Root-Pfad oder mit anderen Worten wwwroot

private readonly IHostingEnvironment _hostingEnvironment; 

public HomeController(IHostingEnvironment hostingEnvironment) 
{ 
    _hostingEnvironment = hostingEnvironment; 
} 

Stellen Sie sicher, den Namespace in die Datei hinzuzufügen zugreifen möchten!

using Microsoft.AspNetCore.Hosting; 

Nachdem ich den Grundstein in meinem gewünschten Controller-Auslegen fertig sind, in der gleichen Datei wollte ich nur eine bestimmte Seite meiner Arbeit nutzen. Es wird der Einfachheit halber im Beispielcode als Index dargestellt.

public IActionResult Index() 
{ 
    ViewBag.wwwRootPath = _hostingEnvironment.ContentRootPath; 
    return View(); 
} 

Ausblick:

Es scheint, wie .NET Core Microsoft auf Laufzeit oder Build nur ~/ in die relative Stammverzeichnis konvertiert, wenn sie innerhalb eines src Attribut innerhalb eines Elements ist. Diejenigen, die Bibliotheken von Drittanbietern verwenden oder sich in Situationen befinden, in denen Sie eine andere Methode zum Aufrufen Ihrer Dateien angeben müssen, reicht diese Lösung aus, bis sie erweiterbar ist. Ich werde das Beispiel in der Frage als ein Beispiel für die Lösung verwenden. Dieser Code hat also nicht, wie bereits erwähnt, in der Anwendung funktioniert.

<img data-original="~/folder/file.png" /> 

Die Lösung:

<img data-original="@ViewBag.wwwRootPath/folder/file.png" /> 

Hinweis: Dies funktioniert auch für JavaScript und CSS! Platzieren Sie einfach die ViewBag.wwwRootPath in Ihre gewünschten Dokumente für Konsistenz!