How do I get the value from (php encoded json) using angular javascript?

Question

In the console I can only see succes and $scope.data.username prints nothing. And a second question: In my php do i need to send status and status_massage? why?

in my js:

 $scope.register = function register() {
            $http.post('.../api/user.php', {username: $scope.user.username, password: $scope.user.password, func: 'register'}).
                    success(function(data, status, headers, config) {
                console.log('succes');
                $scope.data = data;
                console.log($scope.data.username);
            }).
                    error(function(data, status, headers, config) {
                console.log('error');
            });
        };

In postman it wil return

    {
    "status": 200,
    "status_message": "OK",
    "data": {
        "username": "smith99"
    }
}

And my php script does:

            $response['status'] = 200;
        $response['status_message'] = "OK";
        $response['data'] = array(
            'username' => $user
        );    
        $jsonResponse = json_encode($response);
        echo $jsonResponse;

Answer 1

Currently you've merged status,status_message and data into your response body, which is regarded as data in Angular's success(function(data, status, headers, config) {}). So a quick and dirty fix is use $scope.data = data.data in your success callback.

However, it's not a proper way to merge everything into the response body. For HTTP response code, you should set as

<?php
http_response_code(200);
?>

while for your response body, you can simply set username as

$response['username'] = @user   
$jsonResponse = json_encode($response);
echo $jsonResponse;

This way you don't change your current Angular code.