Verwenden Sie Blade innerhalb einer JavaScript-Variablen

Question

Ich wachte heute Morgen mit einer dummen Frage auf. Können Sie in einem JavaScript-Variable setzen Klinge:

var NoImg = '{{ asset('img/ni-img.png') }}'; 

dass ausgibt als String, alles was ich brauche ist es ein Bild

Answer 1

Yep zur Ausgabe -, die den Weg zu Ihrem Bild in Ihre JS direkt injizieren einfache Anführungszeichen der Zeichenfolge

Wenn Sie benötigen, um dann diese Zeichenfolge als ein Bild zu verwenden, müssen Sie ein img.src auf den Weg zu bringen, wie

document.getElementByID('myImage').src = '{{ asset('img/ni-img.png') }}' 

Answer 2

Ja. Blade ist eine serverseitige Vorlagen-Engine. Wenn Sie eine Blade-View-Datei haben, wird sie vor dem Javascript ausgeführt. In Ihrem Fall wird NoImg den erweiterten Wert vom Helfer-Asset() zurückgegeben, wenn der HTML-Code vom Server zurückgegeben wird.

Dies wird die Arbeit in Ordnung sein:

<?php 
    // variable from your controller... 
    $image = 'https://images.google.com/images/branding/googlelogo/1x/googlelogo_color_272x92dp.png'; 
?> 

// your js inside of a blade file... 
var image = new Image(272, 92); 
image.src = '{{ $image }}'; // or asset("path/to/your/image.png") 
document.body.appendChild(image); 

Answer 3

Ja, aber es ist am besten json_encode zu verwenden, um sicherzustellen, dass die resultierende Ausgabe ist JavaScript freundlich:

var NoImg = {!! json_encode(asset('img/ni-img.png')) !!}; 

PHP wird die Anführungszeichen hinzufügen (für Strings), alle notwendigen Escaping-Zeichen (wenn Sie beispielsweise einen ' in Ihrem Dateinamen haben) und komplexere Datenstrukturen wie Arrays/Objekte ebenfalls behandeln.