I'm learning AngularJS at the moment and I'm trying to create something with the $http service and everytime i send my data throw it either as post or get the server side (PHP) tells me it's an empty data (NULL) here is my code so far.
I would like to know why it's always receiving an empty string of data as well as does Angular code the data that is sent as json or normal data attribute like in PHP => (name=ahmed&job=student)

Controller.js

var app = angular.module('AddArticle', []);
app.controller("AddArticlesController", function($scope, $http, $httpParamSerializerJQLike) {
    $scope.SubmitData = function() {

        $http({
            url: 'Inc/newArticle.php',
            method: 'POST',
            params: $httpParamSerializerJQLike({ArticleSubject: $scope.ArticleSubject, ArticleContent: $scope.ArticleContent}),
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded'
            }
        }).then(function(response) {
            if (response.data == "yes") {
                $scope.show = "Sent";
            } else {
                alert(response.data);
            }
        }, function(response) {
            alert("failed php");
        });
    };
});

note that the following PHP code works fine without any problems when you send it a data from a regular form, Ajax or JQuery Ajax

newArticle.php

    <?php 
        require_once $_SERVER['DOCUMENT_ROOT'] . "HardWork Results/AngularJS/Inc/functions.php";
// the following two echo are for testing onle
        echo $_POST["ArticleSubject"];
        echo $_POST["ArticleContent"];
        $Subject = htmlspecialchars($_GET["ArticleSubject"]);
        $Content = htmlspecialchars($_GET["ArticleContent"]);
        if (empty($Subject)) {
            echo "Subject is null";
        }
        if (empty($Content)) {
            echo "Content is null";
        }
        if (!empty($Subject) && !empty($Content)) {
            if (AddArticle($Subject, $Content) ) {
                echo "yes";
            } else {
                echo "no";
            }
        }
    ?>

index.html

<div class="Article" data-ng-app="AddArticle" data-ng-controller="AddArticlesController">
    <form name="Articles" method="post" data-ng-submit="SubmitData()">
        <div class="form-group">
            <label>Article Subject: </label>
            <input type="text" required id="ArticleSubject" name="ArticleSubject" placeholder="ex: Moussa is shitty TA" data-ng-model="ArticleSubject" />
        </div>
        <div class="form-group">
            <label>Article Content: </label>
            <textarea rows="10" cols="50" required id="ArticleContent" name="ArticleContent" placeholder="ex: We know Moussa is Awesome, have fun and enjoy life" data-ng-model="ArticleContent"></textarea>
        </div>
        <button type="submit" class="submit" data-ng-click="SubmitData()" data-ng-init="show='Send'">{{ show }}</button>
    </form>
    <div class="ArticleDesign">
        <h1 data-ng-bind="ArticleSubject"></h1>
        <p data-ng-bind="ArticleContent"></p>
    </div>
</div>