在Angularjs 1.3中显示Laravel 5验证错误

我是Laravel 5和angularjs的新手。 我正在一个项目中，该项目使用laravel 5作为后端，并使用angularjs作为前端。 我将laravel 5用于RESTful API路由，这些路由可通过angularjs前端访问。

我已经找到了一种解决方案，用于捕获laravel 5表单验证错误并将其显示在angularjs前端中，如下所示。

我的问题是：这是可接受的工作方式吗？ 还是有更好的方法来实现这一目标？

我的代码：

在Laravel 5中 ：1.我正在通过专用的请求类进行表单验证。 例如，对于创建页面表单，我在app\\requests文件夹中有一个PageRequest类，其代码如下：

class PageRequest extends Request {

/**
 * Determine if the user is authorized to make this request.
 *
 * @return bool
 */
public function authorize()
{
    //any authorized user validations here..
    return true;
}

/**
 * Get the validation rules that apply to the request.
 *
 * @return array
 */
public function rules()
{
    return [
        'menuName' => 'required | min:5 | max:50',
        'position' => 'required',
        'visible'  => 'required'
    ];
}

}
2.接下来，在我的PagesController中，该页面提供了RESTful api的方法，例如create page表单将发回到PagesController的store方法，如下所示：

class PagesController extends BaseController{

    /**
     * Store a newly created resource in storage.
     *
     * @param PageRequest $request
     * @return Response
     */
    public function store(PageRequest $request)
    {
        $request['slug'] =$request['menuName'];
        return $this->page->create($request->all()) ? json_encode(['success'=>'true']) : json_encode($request->messages());
    }
}  

3.然后在我的angular content.js文件中，该文件使用控制器定义了ui路由器状态，我有以下代码片段来处理创建页面：

.state('content.subjects.pages.create',{
            url:'/create',
            views:{
                'forms@content.subjects':{
                    templateUrl:'/partials/create-page.html',
                    controller:['$scope', '$stateParams','$state', 'Subject', 'Page',
                    function($scope, $stateParams, $state, Subject, Page){
                        $scope.subject = {};
                        $scope.pages={};
                        $scope.messages={}; //place holder for the error messages
                        Subject.edit($stateParams.subjectSlug).success(function(data){
                           $scope.subject = data;
                        });
                        Subject.pages($stateParams.subjectSlug).success(function(data){
                            $scope.pages = data;
                        });
                        $scope.subject_id = $scope.subject.id;
                        $scope.submitPage = function(){
                            $scope.pageData['subject_id'] = $scope.subject.id;
                            Page.save($scope.pageData).success(function(data){
                                $scope.pages.push($scope.pageData);
                                $state.go('content.subjects.pages', {subjectSlug:$scope.subject.slug});
                            }).error(function(data){
                                //if the validation in laravel fails it will return the $request->messages as json
                                // we assign it to the $scope.messages object
                               $scope.messages = data;
                            });
                        };
                    }]
                }
            }
        })  

4.最后，在create-pages.html部分中，我可以将$ scope.messages引用为：

<div class="row page create-form" >
<!--<div id="messages" ng-show="message">{{ message }}</div>-->
<form class="form-horizontal create page" role="form" data-ng-submit="submitPage()">
    <h4 class="form-title">Create New Page</h4>
    <div class="form-group menuName">
        <div class="input-group has-feedback" data-ng-class="{'has-error':errorMenuName}">
            <span class="input-group-addon">Page Name</span>
            <input type="text" class="form-control menuName" name="menuName" data-ng-model="pageData.menuName"/>
            <span class="glyphicon glyphicon-warning-sign form-control-feedback"></span>
        </div>
        <span class="text-danger">{{messages['menuName']}}</span>
    </div>
    <div class="form-group position">
        <div class="input-group has-feedback" data-ng-class="{'has-error':errorPosition}">
            <span class="input-group-addon">Position</span>
            <input type="text" class="form-control position" name="position" data-ng-model="pageData.position"/>
            <span class="glyphicon glyphicon-warning-sign form-control-feedback">}</span>
        </div>
        <span class="text-danger">{{messages['position'][0]}}</span>
    </div>
    <div class="form-group visible">
        <div class="input-group has-feedback" data-ng-class="{'has-error':errorVisible}">
            <span class="input-group-addon">Published</span>
            <input type="text" class="form-control visible" name="visible" data-ng-model="pageData.visible"/>
            <span class="glyphicon glyphicon-warning-sign form-control-feedback"></span>
        </div>
        <span class="text-danger">{{messages['visible'][0]}}</span>
    </div>
    <div class="form-group layout">
        <div class="input-group hidden has-feedback" data-ng-class="{'has-error':errorLayout}">
            <span class="input-group-addon">Page Layout</span>
            <input type="text" class="form-control layout" name="layout" data-ng-model="pageData.layout"/>
            <span class="glyphicon glyphicon-warning-sign form-control-feedback"></span>
        </div>
    </div>
    <div class="form-group form-action create">
        <div class="btn-container create">
            <button class="btn btn-formIcon" type="submit"><span class="glyphicon glyphicon-plus"> Create</span></button>
        </div>
    </div>
</form>

有更好的方法吗？

任何有关更好方法的建议将不胜感激。