title: Laravel pass json to vue.js
body: <p>I'm using Laravel and I would like to pass json to my <code>new Vue</code> instance. How could I do this. </p>
  
  <p>I pass the employees object like this:</p>
  
  <pre><code> $employees = EmployeeModel::with('role','department.company')-&gt;get();
   return view('employees.employees')-&gt;with('employees',$employees);
  </code></pre>
  
  <p>Then in my new Vue I do it like this:</p>
  
  <pre><code>new Vue({
              el: 'body',
              data:{
                  role: '',
                  company: '',
                  list:'{{ $employees }}',
                  created() {
                      this.list = JSON.parse(this.list);
                  }
              }
          });
  </code></pre>
  
  <blockquote>
    <p>It throws an error:vue.js:983 [Vue warn]: Error when evaluating
    expression "CompanyName".</p>
  </blockquote>
  
  <p>When I put the json manual into the list it works! So like this:</p>
  
  <pre><code>  new Vue({
                  el: 'body',
                  data:{
                      role: '',
                      company: '',
              list:[{"EmployeeId":1,"RoleId":5,"DepartmentId":6,"InternId":1,"FirstName":"Zoe","LastName":"Altenwerth","Bio":"Quidem perferendis.","email":"Kole.Bechtelar@hotmail.com","LinkedIn":"Sterling.Schowalter@example.net","Gender":0,"password":"$2y$10$bbUlDh2060RBRVHSPHoQSu05ykfkw2hGQa8ZO8nmZLFFa3Emy18gK","PlainPassword":"gr^S=Z","remember_token":"D528C0Ba1Xzq3yRV7FdNvDd8SYbrM0gAJdFUcOBq4sNEJdHEOb2xIQ0geVhZ","Address":"0593 Dallin Parkway Apt. 499\nBotsfordborough, MT 12501","Zip":"21503-","City":"East Janiston","ProfilePicture":null,"BirthDate":"2002-10-13 00:00:00","StartDate":"1995-11-09 21:42:22","EndDate":"2011-01-27","Suspended":0,"created_at":"2016-02-29 12:21:42","updated_at":"2016-03-02 11:53:58","deleted_at":null,"role":{"RoleId":5,"RoleName":"Superadministrator","Description":"Mag administrators toevoegen en bewerken","deleted_at":null,"created_at":"-0001-11-30 00:00:00","updated_at":"-0001-11-30 00:00:00"},"department":{"DepartmentId":6,"CompanyId":12,"DepartmentName":"com","Description":"Accusantium quae.","deleted_at":null,"created_at":"2016-02-29 12:21:41","updated_at":"2016-02-29 12:21:41","company":{"CompanyId":12,"CompanyName":"Dare, Bailey and Bednar","Logo":null,"Address":"85762 Tabitha Lights\nWest Jettie, AK 20878-2569","Zip":"29601","City":"Traceside","KvKNumber":"84c70661-9","EcaboNumber":"fdee61e3-a22d-3332-a","deleted_at":null,"created_at":"2016-02-29 12:21:41","updated_at":"2016-02-29 12:21:41"}}}]
                      created() {
                          this.list = JSON.parse(this.list);
                      }
                  }
              });
  </code></pre>
  
  <p>So how can I pass the $employees object to my <code>new Vue</code> instance and use it?</p>