javascript - angular js将数据插入列表不起作用

我有一个Json列表，要保存在angular js score var中

 $scope.jobTemplate = [{ type: "AddInstructions", visible: false, buttonText: "Add Instructions", editableInstructionsList: [{ Number: totalEditableInstruction, Text: "Instruction 1"}] },
    { type: "AddSingleQuestionsList", visible: false, buttonText: "Add Ques. (single Ans.)", singleQuestionsList: [{ Number: totalSingleQuestionList, Question: "What is your gender ?", Options: "Male1;Female2"}] },
    { type: "AddMultipleQuestionsList", visible: false, buttonText: "Add Ques. (Multiple Ans.)", multipleQuestionsList: [{ Number: totalMultipleQuestionList, Question: "What is your multiple gender ?", Options: "Malem1;Femalem2"}] },
    { type: "AddTextBoxQuestionsList", visible: false, buttonText: "Add Ques. (TextBox Ans.)", textBoxQuestionsList: [{ Number: totalTextBoxQuestionList, Question: "Who won 2014 FIFA World cup ?", Options: "text"}] },
    { type: "AddListBoxQuestionsList", visible: false, buttonText: "Add Ques. (ListBox Ans.)", listBoxQuestionsList: [{ Number: totalListBoxQuestionList, Question: "What is your multiple gender ?", Options: "Malem1;Femalem2"}] }
];

我按一下按钮来推送数据

 // single questions..
$scope.InsertSingleQuestionRow = function () {
    totalSingleQuestionList = totalSingleQuestionList + 1;
    var singleQuestionsList = { Number: totalSingleQuestionList, Question: $('#SingleQuestionTextBoxQuestionData').val(), Options: $('#SingleQuestionTextBoxAnswerData').val() };
    $scope.jobTemplate[1].singleQuestionsList.push(singleQuestionsList);
    refreshSingleQuestionsList();
}

虽然在用户界面中，新添加的项目显示正确，但是当我尝试通过http发布将当前范围的数据可变地发送到服务器时，它没有最新数据。

$scope.ClientCreateTemplateFunction = function () {
    var clientCreateTemplateData =  $scope.jobTemplate;
    var url = ServerContextPah + '/Client/CreateTemplate';
    if (true) {
        //startBlockUI('wait..', 3);
        $http({
            url: url,
            method: "POST",
            data: clientCreateTemplateData,
            headers: { 'Content-Type': 'application/json' }
        }).success(function (data, status, headers, config) {
            //$scope.persons = data; // assign  $scope.persons here as promise is resolved here
            //stopBlockUI();

        }).error(function (data, status, headers, config) {

        });
    }
    else {
        $scope.showErrors = true;
        showToastMessage("Error", "Some Fields are Invalid !!!");
    }

}

我也尝试使全局变量。我不知道为什么范围变量在UI上可以正常工作，而通过HTTP发布将相同的数据发送到服务器时却不能正常工作。
帮我。

我附加了一个快照，在UI中它显示了两个列表，而当我console.log同一作用域变量时，它仅显示了一个列表。

最佳答案

$scope.ClientCreateTemplateFunction = function() {
  var clientCreateTemplateData = $scope.jobTemplate;
  var url = ServerContextPah + '/Client/CreateTemplate';
  if (true) {
    //startBlockUI('wait..', 3);
    $http.post(url, $scope.jobTemplate).then(onSuccess, onError);

    function onSuccess(data, status, headers, config) {
      //$scope.persons = data; // assign  $scope.persons here as promise is resolved here
      //stopBlockUI();
    };

    function onError(data, status, headers, config) {};

  } else {
    $scope.showErrors = true;
    showToastMessage("Error", "Some Fields are Invalid !!!");
  }

}