title: angular js $http post with laravel
body: <p><strong>Problem</strong></p>
  
  <p>When I try to POST data I get error. For sure I do something wrong, also im new at angular. When I do GET all work fine, but Im not sure how to do POST.</p>
  
  <p><strong>Controller</strong></p>
  
  <pre><code>myApp.controller('createListController', ['$scope', '$log', '$http',
      function($scope, $log, $http){
          $http({
              method: 'POST',
              url: 'http://localhost:8888/lists',
              data: $scope.name
          })
      }]);
  </code></pre>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;form method="post" action="" &gt;
      &lt;label&gt;List name&lt;/label&gt;
      &lt;input type="text" ng-model="name" name="name"  class="form-control" placeholder="Type list name" /&gt;
      &lt;button type="submit" ng-model="submit" name="submit"  class="btn btn-primary form-control"&gt;Add list&lt;/button&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p><strong>Laravel rout.php</strong></p>
  
  <pre><code>Route::group(['middleware' =&gt; 'cors'], function () {
      Route::get('lists', 'ListsController@index');
      Route::post('lists', 'ListsController@store');
  });
  </code></pre>
  
  <p><strong>Laravel middleware</strong></p>
  
  <pre><code>class Cors
  {
      public function handle($request, Closure $next)
      {
          $response = $next($request);
          $response-&gt;headers-&gt;set('Access-Control-Allow-Origin', '*');
          $response-&gt;headers-&gt;set(
              'Access-Control-Allow-Headers',
              'Authorization, Content-Type, If-Match, If-Modified-Since, If-None-Match, If-Unmodified-Since'
          );
          $response-&gt;headers-&gt;set('Access-Control-Allow-Credentials', 'true');
          $response-&gt;headers-&gt;set('Access-Control-Allow-Methods', '*');
          return $response;
      }
  }
  </code></pre>
  
  <p><strong>Laravel kernel.php</strong></p>
  
  <pre><code>    protected $routeMiddleware = [
          'cors' =&gt;  \App\Http\Middleware\Cors::class,
      ];
  }
  </code></pre>
  
  <p><strong>Attempted to solve with</strong> </p>
  
  <pre><code>myApp.controller('createListController', ['$scope', '$log', '$http',
      function($scope, $log, $http){
          if ($scope.submit == true){
  
          $http({
              method: 'POST',
              url: 'http://localhost:8888/lists',
              data: {name: 'text'}
          })
  
          .success(function () {
              console.log('true');
  
          })
          .error(function(){
              console.log('false');
          })
          }
  
      }]);
  </code></pre>
  
  <p>But it's not working too. I don't know what I do wrong and how to post data right..</p>
  
  <p><strong>Error message</strong></p>
  
  <p>Error from console: XMLHttpRequest cannot load localhost:8888/lists. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'localhost'; is therefore not allowed access.</p>
  
  <p><strong>Question</strong></p>
  
  <p>How do I solve this error and get angular js $http post with laravel?</p>
  
  <p><strong>My opinion</strong></p>
  
  <p>I think there is something wrong in angular controller, it can't get data from form or something like that maybe.</p>