在 Blade 模板中将 PHP 变量传递给 JavaScript

IT技术 javascript laravel laravel-blade
2021-03-02 07:39:35

JavaScript 有什么方法可以从 Laravel Blade 模板中的控制器获取变量？

示例：我有以下代码：

$langs = Language::all();
return View::make('NAATIMockTest.Admin.Language.index',compact('langs'));

我可以获取$langs并将其传递给 JavaScript 吗？我已经使用了PHP-Vars-To-Js-Transformer。但是当我JavaScript::put()在控制器中使用两个功能时。它没有用。有什么帮助吗？

这是我在控制器中的创建函数：

public function create()
{
    $names = $this->initLang();
    Javascript::put([
        'langs' => $names
    ]);
    
    return View::make('NAATIMockTest.Admin.Language.create',compact('names'));
}

这是我的观点：

@extends('AdLayout')
@section('content')
<script type="text/javascript">
    var app = angular.module('myApp', []);
    app.controller('langCtrl', function($scope) {
        $scope.languages = langs;
    });
</script>
    
<div class="container-fluid" ng-app="myApp" ng-controller="langCtrl">
    <div class="row">
        <div class="col-md-8 col-md-offset-2">
            <div class="panel panel-default">
                <div class="panel-heading">
                    <h2>Create language</h2>
                </div>
                    
                <div class="panel-body">
                    {!! Form::open() !!}
                        <p class="text-center">
                            {!! Form::label('Name','Language: ') !!}
                            <input type="text" name="searchLanguage" ng-model="searchLanguage">
                        </p>
    
                        <select name="Name[]" multiple size="10" ng-model="lang" ng-click="show()">
                            <option value="@{{v}}" ng-repeat="(k,v) in languages | filter:searchLanguage">
                                @{{v}}
                            </option>
                        </select><br>
    
                        <div class="text-center">
                            {!! Form::submit('Create',['class'=>'btn btn-primary']) !!}&nbsp;
                            {!!   Html::linkAction('NAATIMockTest\LanguageController@index', 'Back', null, array('class' => 'btn btn-primary')) !!}
                        </div>
                    {!! Form::close() !!}
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

我的 javascript.php 在 config 文件夹中：

<?php
return [
    'bind_js_vars_to_this_view' => 'footer',
    'bind_js_vars_to_this_view' => 'NAATIMockTest.Admin.Language.create',
    'bind_js_vars_to_this_view' => 'NAATIMockTest.Admin.Language.edit',
    
    'js_namespace' => 'window',
];

这个想法是：我在 MySQL 中有一种表语言。我想显示具有多个属性的下拉列表可供选择，我也想使用 angularjs 进行搜索。这就是我想将变量从控制器传递给 JavaScript 的原因。此外，我在 LanguageController 中有一个名为 initLang 的函数来检查数据库中是否存在任何语言，它不会显示在创建视图的下拉列表中。

6个回答

一个对我有用的例子。

控制器： 

public function tableView()
{
    $sites = Site::all();
    return view('main.table', compact('sites'));
}

看法：

<script>    
    var sites = {!! json_encode($sites->toArray()) !!};
</script>

为了防止恶意/意外行为，您可以JSON_HEX_TAG按照 Jon 在链接到此SO 答案的评论中的建议使用

<script>    
    var sites = {!! json_encode($sites->toArray(), JSON_HEX_TAG) !!};
</script>
nvm，我没有意识到我在使用时不需要引号 json_encode
2021-04-20 07:39:35
@ken 哦，这确实有效，但是在 html 的开头和结尾都有引号。我怎样才能摆脱它们？
2021-04-24 07:39:35
@Andrew 您可以删除双引号并重试。
2021-04-28 07:39:35
要不就 var sites = @json($sites->toArray())
2021-05-07 07:39:35
您可能想将 JSON_HEX_TAG 添加到 json_encode {!! json_encode($sites->toArray(), JSON_HEX_TAG) !!}; stackoverflow.com/questions/24855186/...
2021-05-10 07:39:35

标准 PHP 对象

向 JavaScript 提供 PHP 变量的最佳方式是json_encode. 使用 Blade 时，您可以执行以下操作：

<script>
    var bool = {!! json_encode($bool) !!};
    var int = {!! json_encode($int) !!};
    /* ... */
    var array = {!! json_encode($array_without_keys) !!};
    var object = {!! json_encode($array_with_keys) !!};
    var object = {!! json_encode($stdClass) !!};
</script>

还有一个 Blade 指令用于解码为JSON. 我不确定从哪个版本的 Laravel 开始，但在 5.5 中它可用。像下面这样使用它：

<script>
    var array = @json($array);
</script>

Jsonable 的

例如，当使用 Laravel 对象时，Collection或者Model您应该使用该->toJson()方法。所有实现该\Illuminate\Contracts\Support\Jsonable接口的类都支持此方法调用。呼叫自动返回JSON。

<script>
    var collection = {!! $collection->toJson() !!};
    var model = {!! $model->toJson() !!};
</script>

使用Modelclass 时，您可以在 中定义$hidden属性class，这些属性将在JSON. $hidden正如其名称所描述的那样，该属性隐藏了敏感内容。所以这个机制对我来说是最好的。像下面这样做：

class User extends Model
{
    /* ... */

    protected $hidden = [
        'password', 'ip_address' /* , ... */
    ];

    /* ... */
}

在你看来

<script>
    var user = {!! $user->toJson() !!};
</script>
var bool = {!! json_encode($bool) !!};这对我有用。谢啦！
2021-04-25 07:39:35
根据使用庞大的库或直接响应客户端，这是一种常见的解决方案。
2021-05-08 07:39:35
最好的办法是按照什么？
2021-05-10 07:39:35

假设您有一个名为$services您要传递给视图的集合。

如果您需要一个带有 names 的 JS 数组，您可以按如下方式迭代：

<script>
    const myServices = [];
    @foreach ($services as $service)
        myServices.push('{{ $service->name }}');
    @endforeach
</script>

注意：如果字符串有特殊字符（如ó或 HTML 代码），您可以使用{!! $service->name !!}.

如果您需要一个对象数组（具有所有属性），您可以使用：

<script>
  const myServices = @json($services);
  // ...
</script>

注意：这个刀片指令@json不适用于旧的 Laravel 版本。您可以使用json_encode其他答案中所述的方法获得相同的结果。

有时您不需要将完整的集合传递给视图，而只需一个具有 1 个属性的数组。如果这是你的情况，你最好$services = Service::pluck('name');在你的控制器中使用。

我记得，最新版本的 Laravel 也有一个 Blade 指令，可以像@json($services).
2021-05-11 07:39:35
为什么不使用var sampleTags = [{{ $services->implode(',') }}];或类似？
2021-05-14 07:39:35 
$langs = Language::all()->toArray();
return View::make('NAATIMockTest.Admin.Language.index', [
    'langs' => $langs
]);

然后在视图中

<script type="text/javascript">
    var langs = {{json_encode($langs)}};
    console.log(langs);
</script>

它不漂亮

感谢 Pawel Bieszczad、The Alpha 和所有试图解决我的问题的人。我刚醒。是的，我确实尝试过你的代码 Pawel Bieszczad，但它给我带来了问题：“未捕获的 SyntaxError：意外标记 &”。我正在使用 laravel-5 而不是 laravel-4，所以文件 filters.php 不存在。所以我该怎么做。
2021-04-16 07:39:35
你能在该行上发布代码以及与之相关的任何内容吗？
2021-04-21 07:39:35
我的代码没有使用 Javascript 类。如果您仅使用我的代码在控制器中创建一个测试方法，然后在视图中注释除我的代码之外的所有其他内容，您应该会在控制台中看到 langs 对象。然后您可以在 javascript 中使用 langs 变量
2021-04-21 07:39:35
这个错误是未定义的变量：langs（视图：/home/thienvulai/laravel/sls/resources/views/NAATIMockTest/Admin/Language/create.blade.php）。当我尝试使用 Javascript::put([ 'langs' => $names ]);
2021-04-22 07:39:35
感谢您的代码，但它向我展示了这个问题：LanguageController.php 第 34 行中的 FatalErrorException: Call to a member function toArray() on a non-object
2021-05-04 07:39:35

试试这个 - https://github.com/laracasts/PHP-Vars-To-Js-Transformer 是将 PHP 变量附加到 Javascript 的简单方法。

其它你可能感兴趣的问题
上一篇在网页中嵌入视频后如何删除 youtube 品牌？ 下一篇意外令牌 < react-router组件中的错误