Question

我目前正在开发一个简单的检查应用程序，使用角度作为我的前端，我遇到了这个问题，这是困扰我两天，直到现在，我的问题是如何发出请求（POST）你的数据要发布是从我的视图中的迭代数据（在我的情况下，是question.id和tempanswer（ng-repeat指令）），我知道如何发布单个请求但不是这个 - ^ _ ^。

看看我的snnipet代码..

后端。

public function submitExam() {

    $student_id = $this->request->student_id;
    $subject = Subject::find($this->request->subject_id);

    //$question_count = Question::where('subject_slug', $subject->slug)->count();

    $tempAnswers = json_decode($this->request->answers);
    //dd($this->request->answers);
    foreach ($tempAnswers as $tempQuestionKey => $tempAnswer) {

        Tempanswer::insert([
            'question_id' => $tempQuestionKey,
            'temp_answer' => $tempAnswer,
            'student_id'  => $student_id,
            'subject_id'  => $subject->id
            ]);

        Examinationresult::insert([
            'question_id' => $tempQuestionKey,
            'subject_id'  => $subject->id,
            'student_id'  => $student_id
            ]);
    }

角（前端）。

$scope.mobileSubmitExam = function() {
        var result = $window.confirm('Are you sure to submit?');
        //var tempAnswer = {$scope.examDetail[0].id: $scope.answers};
        var submitInfo = {
            'answers': $scope.answers;
            'student_id': $scope.studentDetail.id,
            'subject_slug': $scope.subject_slug,
            'subject_id': subject_id
        };

        if(result == true) {

            $http.post(BASE_URL + 'mobile/examination/submit', submitInfo)
                .success(function(response) {
                    console.log(response);
                })
                .error(function() {
                    $window.confirm('Error on submitting the examination!');
                })
        }
    };

查看（HTML）。

<div ng-show="!examKey" class="row">
    <div class="col s12">
        <div class="card card grey darken-3">
            <div class="card-content white-text">
                <div>
                    <header>
                        <small>
                            <strong>
                                <p>Student: <span class="white-text">@{{studentDetail.firstname}}&nbsp;&nbsp;@{{studentDetail.middlename[0]}}.&nbsp;&nbsp;@{{studentDetail.lastname}}</span></p>
                                <p>Subject: <span class="white-text">@{{subject_slug}}</span></p>
                                <hr>
                            </strong>
                        </small>
                    </header>
                </div>
                <br>
                <div ng-repeat="detail in examDetail">
                    <header ng-bind="detail.title"></header>
                    <br>
                    <p>@{{detail.question}}</p>
                    <p>@{{detail.choice_a}}&nbsp;&nbsp;&nbsp;@{{detail.choice_b}}&nbsp;&nbsp;&nbsp;@{{detail.choice_c}}&nbsp;&nbsp;&nbsp;@{{detail.choice_d}}</p>
                    <div class="input-field s6">
                        <label for="answers">Answer</label>
                        <input type="text" name="answers" id="answers" ng-model="answers" class="validate">
                    </div>
                </div>
                <hr>
            </div>
            <div class="card-action">
                <button type="submit" class="btn btn-primary btn-xs" ng-click="mobileSubmitExam()">Submit</button>
            </div>
        </div>
    </div>
</div>

我已经在POSTMAN中测试了我的api并且它有效（使用下面的格式）。

answers = {"1": "testing", "2": "testing2"}
student_id = some id
subject_slug = some-subject
subject_id = some id

但我实际上使用它我的后端特别是tempAnswer得到null。我认为这个错误在我的角度，是否有人可以更好地给出一些想法或解决方案^ _ ^。希望你的回应家伙，我对角度全新，但我正在热切地学习它。

Answer 1

我已经在我的应用上调试了这个错误。如果有人有同样的问题也许它可以帮助，我有几个改变视图和模型（角侧）这里。

在角度方面我创建了空对象，它也是每个问题的id的答案容器。

$cope.answers={}; // declare globally.

$scope.mobileSubmitExam = function() {

        var result = $window.confirm('Are you sure to submit?');
        var submitInfo = {
            'answers': JSON.stringify($scope.answers),
            'student_id': $scope.studentDetail.id,
            'subject_slug': $scope.subject_slug,
            'subject_id': subject_id
        };
        console.log(submitInfo);
        if(result == true) {

            $http.post(BASE_URL + 'mobile/examination/submit', submitInfo)
                .success(function(response) {
                    $scope.answers = '';
                    console.log(response);
                })
                .error(function() {
                    $window.confirm('Error on submitting the examination!');
                })
        }
    };

并在视图中。

<input type="text" name="answers" id="answers" ng-model="answers[detail.id]" class="validate"> // after.

<input type="text" name="answers" id="answers" ng-model="answers" class="validate"> // before.

多数民众赞成...感谢所有评论和反应，我真的很感激它..

使用angularjs在一个请求中发布迭代数据

1 个答案: