如何在脚本文件中使用 Laravel Blade？答案

【问题标题】：How to use Laravel Blade in a script file?如何在脚本文件中使用 Laravel Blade？
【发布时间】：2016-02-03 01:30:56
【问题描述】：

我正在尝试使用 tutorial 和 Laravel 5 制作商店定位器应用程序。这些问题中的人 Here 和 Here 似乎正在使用 @foreach 循环和其他刀片模板语言来运行他们的 lat/长坐标。他们是怎么做到的？

当我的地图代码在 js 文件中时，我基本上不知道如何使用刀片循环坐标？这怎么可能？我做错了什么吗？

我正在用一个包含以下代码的 js 文件 (maps.js) 显示我的地图：

function initialize() {

var map_canvas = document.getElementById('map');

// Initialise the map
var map_options = {
    center: location,
    zoom: 10,
    mapTypeId: google.maps.MapTypeId.ROADMAP
}
var map = new google.maps.Map(map_canvas, map_options)

// Put all locations into array
var locations = [
@foreach ($articles as $article)
    [ {{ $article->lat }}, {{ $article->lng }} ]     
@endforeach
];

for (i = 0; i < locations.length; i++) {
    var location = new google.maps.LatLng(locations[i][0], locations[i][1]);

    var marker = new google.maps.Marker({
        position: location,
        map: map,
    }); 
}

// marker.setMap(map); // Probably not necessary since you set the map above

}

但显然这被困在@foreach 行。

PS：如果有人使用 Laravel 5 遵循本教程，我将不胜感激这部分的任何信息：使用 PHP 输出 XML。

【问题讨论】：

标签： javascript php google-maps laravel

【解决方案1】：

无法在外部 Javascript 文件中使用 Blade 模板。

Laravel 只能将数据传递给视图/模板； Javascript 文件是从外部加载的，因此不会将应用数据传递给它们。

为了解决这个问题，您需要在 Blade 模板文件中创建 <script> 标签：

{{-- Code in your template file, e.g., view.blade.php --}}

<script type="text/javascript">

// Put all locations into array
var locations = [
@foreach ($articles as $article)
    [ "{{ $article->lat }}", "{{ $article->lng }}" ], 
@endforeach
];

// NOTE: I've added a comma which will be needed to delimit each array within the array.
//       Quotes will also be needed since lat and long are not integers.

</script>

确保此 sn-p 位于用于包含您的 maps.js 文件的代码之前。如果您已在 <head> 标记中包含 maps.js 文件，则需要将该包含 sn-p 移至页面底部。

然而，这是一个相当基本的解决方案。更好的方法是在初始化时使用 AJAX 从您的 maps.js 文件中检索数据。

当然，这需要您创建一个新的 Controller 方法和相应的路由来处理请求并返回所需的数据。

【讨论】：

这对我来说很完美！但是，有没有办法用多个变量来做到这一点？例如，如果我想将内容放入每个标记中。我怎么能这样做？
什么意思？在您的控制器中，您可以传递更多变量..例如view('myView', ['variable1' => $variable1, 'variable2' => $variable2, etc...]);
是的，我想在变量位置中放置单独的数组。例如，对于每个位置，我还想注入位置的标题和一些其他信息。看到这个帖子后，我在这方面发布了另一个问题。也许这将有助于澄清我的问题：stackoverflow.com/questions/45924237/…

【解决方案2】：

在您提供的示例中，它们使用刀片，因为它们位于刀片文件中，并且所有 JavaScript 都在标签之间。它不是 .js 文件类型，因此您可以通过这种方式使用刀片语言功能。

【讨论】：

【解决方案3】：

您可以从Eloquent 对象创建一个JavaScript 对象，例如看看下面的代码：

// index.blade.php
<script>var userObj = {{ $authUser or 'undefined' }}</script>

这是一个blade 视图，我只是加载view 并使用类似这样的方式将collection 传递给视图（使用view composer）：

View::composer('layouts.master', function($view) {
    $user = null;
    if(Auth::check()) {
        $user = Auth::user();
    }
    $view->with('authUser', $user);
});

所以，在我的view 中，我有$authUser，所以我可以轻松地将其转换为JS 对象，例如：

<script>var userObj = {{ $authUser or 'undefined' }}</script>

所以现在，我可以将它用作JS 对象，它位于userObj 变量（JavaScript）中。查看我在将近一年前为Laravel-4 写的this article of mine。

【讨论】：