AngularJS $http.post 404

Question

I'm trying to test posting data to the server using $http.post. The backend is built with laravel.

I'm just learning Angular so there isn't anything complicated going on. When I try to post to /api and I get a 404 error in my browser console. If I open the URl in a browser it does exist. The page itself just returns some json.

Here's the HTML:

<ul>
    <li ng-repeat="brand in brands">
        <input type="checkbox" name="{{brand.brand_name}}" ng-model="brand.checked" ng-change="getSelectedBrands()">
        {{ brand.brand_name }}
    </li>
</ul>   

And the part of the controller responsible for posting the data:

$scope.getSelectedBrands = function() {  
    var data = $filter('filter')($scope.brands, {checked: true});
    $http.post('/api', data).success(function(data, status, headers) {
        //do something
    });        
}

Why it posts on every checkbox check or uncheck is that these checkboxes will be filtering results from the database once I get to that stage.

Any help would be greatly appreciated.

Thanks!

EDIT WITH NETWORK TAB RESULT:

Answer 1

If you open the URI in a browser you are performing a GET request. It's possible your backend is setup to respond to GET routes but not POST.

Answer 2

根据Jeff的评论，您可能需要在控制器中添加以下内容

$http.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded; charset=UTF-8';