web-dev-qa-db-fra.com

laravel-5 variable de passage à JavaScript

y a-t-il un moyen quelconque d'obtenir de la variable par le contrôleur compact Laravel-5?.

Exemple: J'ai le code ci-dessous:

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

Puis-je obtenir ce langs et le passer à JavaScript? J'ai déjà utilisé PHP-Vars-To-Js-Transformer. Mais quand j'utilise JavaScript :: put pour deux fonctions dans le contrôleur. Ça n'a pas marché. De l'aide?

Ceci est mon code en utilisant PHP-Vars-To-Js-Transformer:

LanguageController: Voici ma fonction de création et d'édition:

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');

    }

c'est ma vue créer:

 @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

Ceci est ma vue modifier:

 @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

mon javascript.php dans le dossier config: 

<?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',

];

L'idée est la suivante: J'ai un langage de table dans mysql. Je veux montrer la liste déroulante avec plusieurs attributs à choisir, et je veux aussi chercher avec angularjs. C'est pourquoi je souhaite transmettre la variable du contrôleur à JavaScript. De plus, j'ai une fonction à l'intérieur de LanguageController appelée initLang pour vérifier si une langue existe dans la base de données, elle ne s'affiche pas dans la liste déroulante de la création de la vue.

javascriptlaravellaravel-5
18
user1610851

Un exemple de travail pour moi. 

Manette: 

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

Vue:

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

Pour empêcher tout comportement malveillant/involontaire, vous pouvez utiliser JSON_HEX_TAG comme suggéré par Jon dans le commentaire qui renvoie à ce SO answer .

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

Objets standard PHP

Le meilleur moyen de fournir des variables PHP à JavaScript est json_encode. Lorsque vous utilisez Blade, vous pouvez le faire comme suit:

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

Il existe également une directive de lame pour le décodage en JSON. Je ne sais pas depuis quelle version de Laravel mais en version 5.5, elle est disponible. Utilisez-le comme suit:

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

Jsonable's

Lorsque vous utilisez des objets Laravel, par exemple Collection ou Model, vous devez utiliser la méthode ->toJson(). Toutes les classes qui implémentent l'interface \Illuminate\Contracts\Support\Jsonable supportent cet appel de méthode. L'appel retourne automatiquement JSON.

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

Lorsque vous utilisez la classe Model, vous pouvez définir la propriété $hidden dans la class. Celles-ci seront filtrées dans JSON. La propriété $hidden, comme son nom l'indique, masque le contenu sensible. Donc, ce mécanisme est le meilleur pour moi. Faites-le comme suit:

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

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

    /* ... */
}

Et quelque part à votre avis

<script>
    var user = {!! $user->toJson() !!};
</script>
12
algorhythm
$langs = Language::all()->toArray();
return View::make('NAATIMockTest.Admin.Language.index', [
    'langs' => $langs
]);

alors en vue

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

Ce n'est pas joli

3
Pawel Bieszczad

Essayez ceci - https://github.com/laracasts/PHP-Vars-To-Js-Transformer Il constitue un moyen simple d’ajouter des variables PHP à Javascript.

2
PawelW

C'est très facile, j'utilise ce code:

Manette :

$langs = Language::all()->toArray();
return view('NAATIMockTest.Admin.Language.index', compact('langs'));

Vue :

<script type="text/javascript">
    var langs = <?php echo json_decode($langs); ?>;
    console.log(langs);
</script>

espérons que cela a été utile, salutations!

0
Radames E. Hernandez

Je sais que les prochaines lignes ne sont pas optimisées, mais c'est un moyen rapide et lisible de le faire fonctionner:

<script>
    var sampleTags = [];
    @foreach ($services as $service)
        sampleTags.Push('{{ $service->name }}');
    @endforeach
</script>

Edit: Désolé, si la chaîne a des caractères spéciaux (comme ó), il est nécessaire d'utiliser {!! $service->name !!}.

0
JCarlos