AngularJS $http.post error Unexpected token F

Question

I'm trying to run my $http.post script and I am getting an error,I tried searching around but couldn't find any answers to my problem.Here is the error that I'm getting when I run my web page.

XHR finished loading: POST "http://mypage/services/json/DownTimeStartByDepartmentId.aspx?CategoryId=-1&Comment=&DepartmentId=6".


SyntaxError: Unexpected token F
    at Object.parse (native)
    at fromJson (http://10.19.13.67/apps/resources/scripts/angular.js:1037:14)
    at $HttpProvider.defaults.defaults.transformResponse (http://10.19.13.67/apps/resources/scripts/angular.js:6948:18)
    at http://10.19.13.67/apps/resources/scripts/angular.js:6923:12
    at Array.forEach (native)
    at forEach (http://10.19.13.67/apps/resources/scripts/angular.js:304:11)
    at transformData (http://10.19.13.67/apps/resources/scripts/angular.js:6922:3)
    at transformResponse (http://10.19.13.67/apps/resources/scripts/angular.js:7594:17)
    at wrappedCallback (http://10.19.13.67/apps/resources/scripts/angular.js:10966:81)
    at http://10.19.13.67/apps/resources/scripts/angular.js:11052:26 

Here is my script that I'm trying to run:

function Model($http) {
var self = this;
self.DowntimeCategories = [];
self.PreviousDowntimeEvents = [];

self.savedata = function () {
    $http({
        method: 'POST'
         , url: 'http://mypage/services/json/DownTimeStartByDepartmentId.aspx'
         , params: {
           DepartmentId: 6
         , CategoryId: -1
         , Comment: ""
         }
         , headers: {'Content-Type':'application/x-www-form-urlencoded; charset=UTF-8'}
    }).success(function (data, status, headers, config) {
        console.log(data);
    }).error(function (data, status, headers, config) {

    });
}     
    Hesto.Ajax.ngget($http, GET_CATEGORIES_NAMES, "", function (data) {
        self.DowntimeCategories = data.data;
    });
}

angular.module('myApp', [])

.controller('DowntimeController', function ($scope, $http) {
    $scope.Model = new Model($http);
    $scope.currentdowntime = function () {
        console.log($scope.Model);
    }
    $scope.printmodel = function () {
        console.log($scope.Model);
        $scope.Model.savedata();
    }     
 }); 

Html:

<div id ="bodyui" ng-app="myApp">

     <div ng-controller="DowntimeController">


           <label><strong>SELECT A CATEGORY NAME :</strong></label><br /> 
           <select ng-model="Model.CurrentDowntimeEvent.CategoryId" ng-options="downtimeCategory.CategoryId as downtimeCategory.CategoryName for downtimeCategory in Model.DowntimeCategories">
           </select>   
         <input type="text" ng-model="Model.CurrentDowntimeEvent.Comment" />
         <input type="button" value="currentdowntime" ng-click="currentdowntime()"/>
         <input type="button" value="savedata" ng-click="printmodel()"/>

    </div>
    </div>

Answer 1

I ran into the same problem. The json returned by the server is not correctly formed.