带有json文件和嵌套数组Angularjs的http帖子

时间:2016-02-24 18:35:29

标签: javascript angularjs json http-post http-get

我有一个应用程序,能够通过http获取和发布关系数据库的模型。我可以在http://localhost/ ** / api / complaint上显示我的数据和JSON数据:

{
"CHECKLISTs": [{
    "COMP_ID": 1,
    "IntOIMRec": "No"
}],
"COMP_ID": 1,
"FileNum": "case1"
}

使用angular:

<tr data-ng-repeat="complaint in complaints">
<td><strong data-ng-hide="complaint.editMode">{{ complaint.FileNum }}</strong></td>
<td>
<p data-ng-hide="complaint.editMode">{{ complaint.CHECKLISTs[0].IntIAB}}</p>
<input data-ng-show="complaint.editMode" type="text" data-ng-model="customer.Status" />
</tr>

我也可以使用此控制器进行http发布:

//Insert complaint
$scope.add = function () {
    $scope.loading = true;
    $http.post('/api/Complaint/', this.newcomplaint).success(function (data) {
        alert("Added Successfully!!");
        $scope.addMode = false;
        $scope.complaints.push(data);
        $scope.loading = false;
    }).error(function (data) {
        $scope.error = "An Error has occured while Adding complaint! " + data;
        $scope.loading = false;
    });
};

但是当我将Checklists [0]添加到我的表单中以添加它时,它不会添加新记录。我的表单代码添加了一个像这样的新记录:

<div class="row">
    <div class="col-md-12">
        <strong class="error">{{ error }}</strong>
        <p data-ng-hide="addMode"><a data-ng-click="toggleAdd()" href="javascript:;" class="btn btn-primary">Add New</a></p>
        <form name="addComplant" data-ng-show="addMode" style="width:600px;margin:0px auto;">
            <div class="form-group">
                <label for="cid" class="col-sm-2 control-label">ID:</label>
                <div class="col-sm-10">
                    <input type="text" class="form-control" id="cid" placeholder="please enter id" data-ng-model="newcomplaint.FileNum" required />
                </div>
            </div>
            <div class="form-group">
                <label for="cname" class="col-sm-2 control-label">Name:</label>
                <div class="col-sm-10">
                    <input type="text" class="form-control" id="cname" placeholder="please enter your name" data-ng-model="newcomplaint.CHECKLISTs[0].IntIAB" />
                </div>
            </div>

            <br />
            <div class="form-group">
                <div class="col-sm-offset-2 col-sm-10">
                    <input type="submit" value="Add" data-ng-click="add()" class="btn btn-primary" />
                    <input type="button" value="Cancel" data-ng-click="toggleAdd()" class="btn btn-primary" />
                </div>
            </div>
            <br />
        </form>
    </div>
</div>

我的console.log输出:

console.log

有人可以告诉我,如果我可以使用角度http.get和http.post显示它,为什么我不能添加到检查表字段,当它显然在JSON文件中,它显示得很好?我得到的错误是[对象对象]?

谢谢

2 个答案:

答案 0 :(得分:0)

只是看一下你的代码,你似乎正在推进$ scope.complaints,而不是$ scope.complaint.CHECKLISTs

你在某处有重复吗?

答案 1 :(得分:0)

$scope.complaints.push(data);更改为$scope.newcomplaint = data。或者,如果投诉确实应该是一个数组,那么您需要在表单上ng-repeat