Angular returning array values wrapped in []

I am working on teaching myself Angular at the moment, and I am currently getting to grips with sending http requests from my angular front-end.

I am successfully sending a POST request, and I am also getting the correct error response back. The error response returned is from Laravel and basically a JSON response.

return Response::json(['message' => $validator->errors()], 422);

This returns something that looks like,

{"message":{
    "first_name":["The first name field is required."],  
    "surname":["The surname field is required."],  
    "email":["The email field is required."],  
    "school_name":["The school name field is required."]
 }}

In my angular template I have this in my controller for now,

app.controller('signupController', function($scope, $http){
console.log("...signup controller initialised...");
$scope.formData = {};
$scope.error = "";
$scope.processForm = function() {
    console.log($scope.formData);
    var postForm = $http.post('http://ift.tt/2f2sAQV', $scope.formData);
    postForm.success(function(data, status, headers, config) {
        $scope.message = data;
    });
    postForm.error(function(data, status, headers) {
        $scope.error = data;
        console.log($scope.error);
    });     
}

});

In my template I form entries that looks like this,

<div class="form-group">
        <label for="firstName" class="is-required">First Name</label>
        <input type="text" class="form-control" id="firstName" name="first_name" ng-model="formData.firstname" ng-class="{'has-error': error.message.first_name}">
        <div class="error__block"></div>
    </div>

Now on error the form input get the has-error class assigned, but the error block shows something like this,

["The first name field is required."]

When I would have thought it would show something like this,

The first name field is required

Am I doing something incorrectly on my laravel end of my angular end?

via Chebli Mohamed