Laravel: как передать переменную в файл JavaScript?

Question

Я хочу показать на графике количество зарегистрированных новых студентов и количество онлайн-студентов в месяц. Я получил данные, но я не знаю, как перенести данные в файл JS, чтобы нарисовать эту диаграмму. Мой js-файл находится в общедоступном каталоге, и я подключился к js-файлу, но я не знаю, как передать ему данные.

Мой контроллер для получения данных

class DashboardController extends AdminBaseController
{
    public function index () 
    {
       $month = 1;
       $totalNewStudent = [];
       $totalOnline = [];
       $totalActive = [];
       for($i = $month; $i < 13; $i++) {
       //count new students
       $newStudents = Member::where('member_type_id',1)- 
       >whereMonth('created_at', $i)->get();
       $totalNewStudent[$i] = $newStudents->count(); 

       //students online
       $onlStudents = Member::where('member_type_id',1)- 
       >whereMonth('updated_at', $i)->get();
       $totalOnline[$i] = $onlStudents->count(); 

       // count card active
       $act = Order::where('status', "active")->whereMonth('updated_at', $i)- 
       >get();
       $totalActive[$i] = $act->count(); 
       return view('admin.dashboard.index', compact('totalNewStudent','totalOnline','totalActive '));
      }
    }
}

view admin.dashboard.index

<div class="card-body collapse in">
    <div class="card-block">
        <div id="products-sales" class="height-300"></div>
    </div>
 </div>

Файл JS

var months = ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12"];
    Morris.Area({
        element: 'products-sales',
        data: [{
            month: '2017-01',
            newstudent: 0,
            online: 0,
        }, {
            month: '2017-02',
            newstudent: 240,
            online: 0,
        }, {
            month: '2017-03',
            newstudent: 0,
            online: 0,
        }, {
            month: '2017-04',
            newstudent: 0,
            online: 190,
        }, {
            month: '2017-05',
            newstudent: 0,
            online: 25,
        }, {
            month: '2017-06',
            newstudent: 0,
            online: 150,
        }, {
            month: '2017-07',
            newstudent: 0,
            online: 0,
        },{
            month: '2017-08',
            newstudent: 80,
            online: 0,
        },{
            month: '2017-09',
            newstudent: 0,
            online: 0,
        },{
            month: '2017-10',
            newstudent: 0,
            online: 0,
        },{
            month: '2017-11',
            newstudent: 300,
            online: 0,
        },{
            month: '2017-12',
            newstudent: 0,
            online: 0,
        }],
        xkey: 'month',
        ykeys: ['newstudent', 'online'],
        labels: ['New Student', 'Online'],
        xLabelFormat: function(x) { // <--- x.getMonth() returns valid index
            var month = months[x.getMonth()];
            return month;
        },
        dateFormat: function(x) {
            var month = months[new Date(x).getMonth()];
            return month;
        },
        behaveLikeLine: true,
        ymax: 300,
        resize: true,
        pointSize: 0,
        pointStrokeColors:['#00B5B8', '#FA8E57', '#F25E75'],
        smooth: true,
        gridLineColor: '#E4E7ED',
        numLines: 6,
        gridtextSize: 14,
        lineWidth: 0,
        fillOpacity: 0.9,
        hideHover: 'auto',
        lineColors: ['#00B5B8', '#FA8E57', '#F25E75']
    });

Answer 1

Самый простой способ:

Добавить переменную к элементу ввода:

<input type="hidden" value="{{ $my_variable }}" id="my-variable">

Получить значение с помощью js:

let myVar = $("#my-variable").val();

Лично я не знаюМне не нравится этот подход. Лучше всего использовать ajax и получать вашу переменную напрямую с сервера.

Надеюсь, это поможет.

Answer 2

Вы возвращаете его как переменную PHP в представление, которое будет иметь файл JS

И добавляете это в представление

// Do this before importing the JS file
var data = {!! json_encode($php_var) !!};

в более новых версиях Laravel

var data= @json($php_var);

Данные будут доступны в файле JS

Или вы можете использовать этот пакет

PHP-Vars-To-Js-Transformer