Displaying ModelState Errors with AngularJS in ASP.NET MVC

I'm trying to show ModelState errors (like ValidationSummary) in ASP.NET MVC using AngularJS.

I'm unable to display the error messages that I'm getting from data.Errors

Here is my code in AngularJS:

$scope.AddUser = function ()
{
    $http.post('adduser', $scope.User).success(function (data, status, headers, config)
    {
        $scope.message = '';
        $scope.errors = [];

        if (data.success === false) {
            $scope.errors = [];
            $scope.errors = data.errors;
        }
        else {
            $scope.message('Successfully Added ' + $scope.User.UserName + '!');
            $scope.user = {};
        }
    }).error(function (data, status, headers, config)
    {
        $scope.errors = [];
        $scope.errors = data.errors;
        $scope.message = 'Unexpected Error';
    }); 
}

//html code:

 <form name="AddUsr" ng-submit="AddUser()">
            <div class="error">{{message}}</div>
            <div class="row">
                <div class="column third">User Name</div>
                <div class="column two-thirds"><input ng-model="User.UserName" required /></div>
            </div>
            <div class="row">
                <div class="column third">Email</div>
                <div class="column two-thirds"><input ng-model="User.Email" required /></div>
            </div>
            <div class="row">
                <div class="column full"><input type="submit" value="Add User" /></div>
            </div>
            <ul>
                <li id="errorMessages" class="error" data-ng-repeat="error in errors">{{error}}</li>
            </ul>
        </form>