Question

我有这个查询，我通过使用分页获取数据：

$data = Mymodel::orderBy('id','desc')->paginate(10);

我在使用刀片文件中的分页链接在引导表中显示数据没有问题：

<table class="table table-bordered table-responsive table-striped table-hover table-condensed">
            <thead>
            <tr>
                <th>id</th>
                <th>value1</th>
                <th>value2</th> 
            </tr>
            </thead>
            <tbody>
            @foreach($data as $row)
                <tr>
                    <td>{{ $row->id }}</td>
                    <td>{{ $row->value1 }}</td>    
                    <td>{{ $row->value2 }}</td>                  
                </tr>
            @endforeach
            </tbody>
        </table>

        {{ $data->links() }}

现在设置谷歌折线图时：

@section('js')
    {{--Google charts--}}
    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    <script type="text/javascript">
        google.charts.load('current', {'packages':['corechart'],'language': 'es'});
        google.charts.setOnLoadCallback(drawLinechart);

        function drawLinechart()
        {

            var record = {!!$data!!};
            var data = new google.visualization.DataTable();/*http://stackoverflow.com/a/22640426/1883256*/
            var rowsnumber = record.length;

            //Declaring the column names
            data.addColumn('number', 'ID');
            data.addColumn('number', 'Value1');
            data.addColumn('number', 'Value2');          

            //Filling each row. Ref:http://stackoverflow.com/a/7861051/1883256
            $.each(record, function(k, v) {
                //display the key and value pair
                //console.log(k + ' is ' + v.id);
                data.addRow([v.id,parseInt(v.value1),parseInt(v.value2)]);
            });

            var options = {
                title: 'Data last '+ rowsnumber +' rows',
                //curveType: 'function',
                backgroundColor: { fill:'transparent'},
                height: 500,
                legend: { position: 'bottom' },              
            };

            var chart = new google.visualization.LineChart(document.getElementById('linechart'));

            chart.draw(data, options);
        }
    </script>

        {{-- end of Google charts--}}
@endsection

这不起作用，因为事实证明，paginate为分页链接插入了html代码，因为我收到以下错误：

未捕获的SyntaxError：意外的标记＆lt;

这是因为$data输出：

var record = <ul class="pagination"> ......等等......而不是Eloquent的收藏品。它实际输出LengthAwarePaginator。

然后如何访问数据（$row->id，$row->value1，$row->value2）在javascript部分？

另一方面，如果我通过另一个查询变量获取数据，这确实有效：

$datachart = Mymodel::orderBy('id','desc')->take(30)->get();

实际上是一个集合。换句话说，这是有效的：

var record = {!!$datachart!!};

但我真正想要的是将数据与分页一起绘制，以便在每个页面中我都可以在折线图中输出相应的值。

有关如何从LengthAwarePaginator访问javascript中的集合数据的任何想法？

解决方法：我得到了另一个具有相同查询但没有分页的集合，现在它正在运行。

Answer 1

尝试

 var record = {!! $data->data !!};

我认为paginator将数据存储在data对象内的response对象中。

使用paginate函数时，Laravel无法获取谷歌图表的数据

1 个答案: