laravel-5将变量传递给JavaScript [英] laravel-5 passing variable to JavaScript

查看:536
本文介绍了laravel-5将变量传递给JavaScript的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

有没有什么方法可以让JavaScript从紧凑型控制器Laravel-5中获取变量。

is there any ways that JavaScript can get the variable from compact controller Laravel-5.

示例:
我有以下代码:

Example: I have the code below:

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

我可以获取此lang并将其传递给JavaScript吗?我已经使用过PHP-Vars-To-Js-Transformer。但是当我在控制器中使用JavaScript :: put两个函数时。它没用。有什么帮助吗?

Can I get this langs and pass it to JavaScript? I already used PHP-Vars-To-Js-Transformer. But when I use JavaScript::put for two functions in the controller. It didn't work. Any help?

这是我的代码,使用PHP-Vars-To-Js-Transformer:

This is my code by using PHP-Vars-To-Js-Transformer:

LanguageController :
这是我的创建和编辑功能:

LanguageController: This is my create and edit function :

public function create()
       {
          $names = $this->initLang();
          Javascript::put([
            'langs' => $names
            ]);

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


           return View::make('NAATIMockTest.Admin.Language.edit', compact('lang'));
           // return View::make('NAATIMockTest.Admin.Language.edit');

    }

这是我的视图创建:

 @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

这是我的视图编辑:

 @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>Edit #{{ $lang->id}}</h2></div>
                <div class="panel-body">
                    {!! Form::model($lang) !!}
                        {!! Form::label('Name','Language: ') !!}&nbsp;{{ $lang->Name }}
                        <!-- {!! Form::text('Name',null,['disabled']) !!}<br> -->
                        {!! Form::hidden('id') !!}<input type="text" name="searchLanguage" ng-model="searchLanguage">
                        </p>

                        <select name="Name[]" size="10">
                            <option value="@{{v}}" ng-repeat="(k,v) in languages | filter:searchLanguage">
                                @{{v}}
                            </option>
                        </select><br>
                        <div class="text-center">
                            {!! Form::submit('Update',['class'=>'btn btn-info']) !!}&nbsp;
                            {!! Html::linkAction('NAATIMockTest\LanguageController@index', 'Back', null, array('class' => 'btn btn-primary')) !!}
                        </div>
                    {!! Form::close() !!}
                </div>
            </div>
        </div>
    </div>
   </div>
   @endsection

我在配置文件夹中的javascript.php:

my javascript.php in config folder:

<?php

    return [

    /*
    |--------------------------------------------------------------------------
    | View to Bind JavaScript Vars To
    |--------------------------------------------------------------------------
    |
    | Set this value to the name of the view (or partial) that
    | you want to prepend all JavaScript variables to.
    |
    */
    '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',

    /*
    |--------------------------------------------------------------------------
    | JavaScript Namespace
    |--------------------------------------------------------------------------
    |
    | By default, we'll add variables to the global window object. However,
    | it's recommended that you change this to some namespace - anything.
    | That way, you can access vars, like "SomeNamespace.someVariable."
    |
    */
    'js_namespace' => 'window',

];

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

The idea is: I have a table language in mysql. I want to show the dropdown list with multiple attributes to choose, and I also want to search with angularjs as well. That's why I want to pass the variable from the controller to JavaScript. Additionally, I have the function inside LanguageController called initLang to check if any language is exist inside the database, it isn't displayed inside the dropdown list in create the view.

推荐答案

我的一个实例。

控制器:

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答案

To prevent malicious / unintended behaviour, you can use JSON_HEX_TAG as suggested by Jon in the comment that links to this SO answer

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

这篇关于laravel-5将变量传递给JavaScript的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆