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

Question

我试图让使用该商店定位器应用程序的教程和Laravel 5.在这些问题的人在这里,并在这里似乎可以用@foreach循环和其他刀片的模板语言通过自己的经/纬度坐标运行.他们是怎么做到的？

当我的地图代码在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.

Answer 1

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

Laravel只能将数据传递给视图/模板; Javascript文件在外部加载,因此App数据不会传递给它们.

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

{{-- 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>

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

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

当然,这需要您创建一个新的Controller方法和相应的路由,它可以处理请求并返回所需的数据.