send data from angularjs form to symfony2 with Rest POST

Question

I'am following this tutorial http://welcometothebundle.com/web-api-rest-with-symfony2-the-best-way-the-post-method/, but I have a client in angularjs and a rest API with symfony.

My problem is I still don't know how can I send the data from my form in angularjs to symfony2's controller then to database Mysql.

update: I know how to add data statically in Client controller to database,but how to do it with values from th angularjs form

public function insertAction()
    {
$client = new Client();
    $client->setName('cccccccc');
    $client->setAdress('ffffffff');
    $client->setCivilit('sssssssss');
    $em = $this->getDoctrine()->getManager();
    $em->persist($client);
    $em->flush();

    return new Response('Id du client créé : '.$client->getId());

and this is app.js in which I define the controller:

.controller('PostsCtrlAjax1', ['$scope', '$http' ,function($scope,$http) {

   $http({method: 'POST', url: 'http://localhost/operation/web/app_dev.php/apiclient/insertcl.json'})
   .success(function(data){
        $scope.posts = data; // response data 
   }).error(function(data, status, headers, config) {
    // called asynchronously if an error occurs
    // or server returns response with an error status.
    console.log("data error ...");
  });
}]);

when I run my client angularjs,the static data will be stocked in the database Any idea please and thanks for help.

Answer 1

You can use this:

$info = $request->getContent();
$data = json_decode($info,true);

then use: $client->setName($data['name']);

Answer 2

So, to store data from angularJS client to symfony2 server, you must do :

Install a simple listener to handle json requests in Symfony

qandidate-labs/symfony-json-request-transformer

The client form (example)

<form ng-submit="submitForm()">
    <input ng-model="postData.name"/>
    <input ng-model="postData.address"/>
    <input ng-model="postData.civility"/>
</form>

The submit form action (client)

$scope.postData = {};

$scope.submitForm = function(){

    $http.post('http://localhost/operation/web/app_dev.php/apiclient/postRoute', $scope.postData);
        .success(function(data){
            $scope.posts = data; // response data, not get data from DB.
        }).error(function(data, status, headers, config) {
            // called asynchronously if an error occurs
            // or server returns response with an error status.
            console.log("data error ...");
        });
};

The store action (server)

use Symfony\Component\HttpFoundation\JsonResponse;
use Symfony\Component\HttpFoundation\Request;

//...
public function insertAction()
{
    $request = new Request();
    $request = $request->createFromGlobals();

    $client = new Client();
    $client->setName($request->request->get('name'));
    $client->setAdress($request->request->get('address'));
    $client->setCivilit($request->request->get('civility'));

    $em = $this->getDoctrine()->getManager();
    $em->persist($client);
    $em->flush();

    return new JsonResponse('Id du client créé : '.$client->getId());
}

If you want return data for reload scope variable, add this to your method :

//...
$clients = $em->getRepository('YourBundle:Client')->findAll();
//...

And change your return to :

//...
return new JsonResponse($clients);

Then, the returned response will contains your data, and $scope.posts will be refresh with new registered data.