javascript - Laravel 5.4 将变量从 Controller 传递到 js 脚本

Question

您好，可以将变量从 Controller 传递到 JS 脚本。当用户加入事件时，我必须执行更改颜色事件。

我需要将变量 $colorrr 传递给我的 js，因为我使用 fullcalendar，有选项 eventColor: 并且我想从 Controller 发送变量 $colorrr。现在只有我检查数据透视表中是否存在事件。它的工作原理是，我的问题是我不知道如何将变量传递给选项 eventColor

Controller :

public function index()
    { 
       $eventscolo=DB::table('save_events')->select('events_id')->get();
       $eventsss=DB::table('events')->select('id','title')->get(); 
             
        foreach ($eventsss as $eventss) 
        {
             
            if(DB::table('save_events')->where('events_id','=',$eventss->id)->exists())
            {
                    
                  $colorrr = 'grey';
                    
            }
            else
                { 
                    if ($eventss->title=="Wydzial 1") 
                        {
                            
                           $colorrr = 'red';
                            
                        }
                            elseif($eventss->title == "Wydzial 2")
                            {
                               
                             $colorrr = 'blue';
                               
                            }
                            elseif ($eventss->title == "Wydzial 3") 
                            {
                               
                             $colorrr = 'green';
                               
                            }
                            elseif ($eventss->title == "Wydzial 4") 
                            {
                                
                               $colorrr = 'yellow';
                                
                            }
                } 

        }
      return view('home',['eventscolo'=>$eventscolo,'eventsss'=>$eventsss,'colorrr'=>$colorrr]);

JS脚本:

<script src="{{ asset('js/fullcalendar') }}/fullcalendar.js"></script>
<script src="{{ asset('js/bootstrap.js') }}"></script>
<script type="text/javascript">

  $(document).ready(function() {
    
    var base_url = '{{ url('/') }}';
    
      
    
    $('#bootstrapModalFullCalendar').fullCalendar({
      weekends: true,
      header: {
        left: 'prev,next today',
        center: 'title',
        right: 'month,agendaWeek'
      },
       eventClick: function(event, jsEvent, view) {
          $('#modalTitle').html(event.title);
          $('#modalBody').html(event.name);
          $('#eventUrl').attr('href','/home/zapis/'+event.id);
          $("#startTime").html(moment(event.start).format('HH:mm '));
          if (event.end) $("#endTime").html(moment(event.end).format('HH:mm '));
          else $("#endTime").html('');              
          $('#fullCalModal').modal();
          return false;
        },
      
      eventLimit: true, // allow "more" link when too many events
      FirstDay: 1,
              contentheight : 650,
              editable : true,
              allDay : false,
              aspectRatio : 2,
              slotLabelFormat : 'HH:mm:ss',
              timeFormat : 'HH:mm',
              displayEventEnd : true,
              events: {
        url: base_url + '/api',
        error: function() {
          alert("cannot load json");
        }
      },
       eventColor: 'colorrr',
    
      
    });
  });
</script>

Answer 1

Controller (将如下值传递到您的 View )

//..........................
//............................
$data['myVal'] = "abc";
return view('myViewPage',['data'=>$data]);

Blade-myViewPage(JS)

<script>
    //Global variable on you blade
    var url = "{{url('/manufacturers-json')}}";
    var custom_val = "{{$data['myVal']}}"; //What ever you are getting from controller ($colorr)
</script>

然后你可以在你的JS中使用这个JS变量。我正在使用 angularJS 这样做。如果在您的情况下上述方法不起作用，请尝试创建一个输入字段。

<input type="hidden" value="<?php echo $colorrr; ?>" id="my_color" />

在 $colorrr 处(或者从 Controller 传递到 View 的任何内容，请确保此变量包含值。
并在你的 JS 中。

var color = $("#my_color").val();