【问题标题】:How to merge array into JSON array如何将数组合并到 JSON 数组中
【发布时间】:2021-11-24 00:39:49
【问题描述】:

我有一个 JSON 文件,我需要在其中添加评论,然后更新该文件。 我为新的 cmets 创建了一个数组

//ADDING NEW COMMENTS
//add new comment within project
$scope.updatecomments = [];
$scope.addnewcomment = function() {
    $scope.updatecomments.push({
        "Author": "test",
        "Text": $scope.NewComment
    })
}

我可以将新的 cmets 发布到 JSON 文件中,但它会覆盖过去的 cmets。 我试图将旧的 cmets 与新的 cmets 合并,如下

$scope.updatecomments = [];
$scope.addnewcomment = function() {
    $scope.updatecomments.push({"Author": "test" ,"Text": $scope.NewComment}).concat($scope.Comments, $scope.updatecomments);
}

$scope.updatecomments = [].concat($scope.updatecomments, 
    $scope.projectDetails.Comments);
$scope.addnewcomment = function() {
    $scope.updatecomments.push({
        "Author": "test",
        "Text": $scope.NewComment
    });
}

我还尝试制作一个新函数,在调用时将两者结合起来,然后发布组合数组

$scope.combine = [];
$scope.combineComments = function (){
    var jsonStr = $scope.projectDetails.Comments;
    var obj = JSON.parse(jsonStr);
          
    obj['Comments'].push({"Author":"Test","Text":$scope.NewComment});
          jsonStr = JSON.stringify(obj);
    }
}

过去几天我一直在研究这个问题,但似乎无法理解。任何帮助将不胜感激!

编辑

JSON 文件中已有数据的示例数据

{
    "Comments":[{
        "Author": "John Doe", 
        "Text": "Work completed"
     }]
}

想要添加到这个(来自html输入文本标签)存储为NewComment

{
    "Comments":[{
        "Author": "Test",
        "Text": "Project flagged"
    }]
}

编辑 2 这就是我获取项目数据的方式

/FIND PROJECTS - ADD TO LIST
  $scope.projectList = [];
    for (var id = 0; id < 30; id++) {
      var targetURL = 'https://happybuildings.sim.vuw.ac.nz/api/sooleandr/project.'+id+'.json';
      $http.get(targetURL).then(
        function successCall(response){
          $scope.projectList.push(response.data);
        }
      );
    }

然后我用它来访问选定的信息

//script
$scope.showData = function(x){
 $scope.projectDetails = x;
 };
//html
<ul class = 'pList'>
   <li ng-repeat = 'x in projectList' class = 'pbList'>
     <button class = 'pbutton' ng-click = 'showData(x)'>
       <label ng-model ='pID'>Project ID: </label>{{x.ProjectID}} <br>
       <label id ='pName'>Project Name: </label> {{x.Name}} <br> 
       <label id ='bID'>Building ID: </label>{{x.BuildingID}}<br>
  <label id ='sDate'>Start Date: </label>{{x.StartDate}}
      </button>
    </li>
  </ul>

然后我有以下变量要发布

$scope.updateProject = function (projectDetails){
  
  var updateproject = {
    "ProjectID":$scope.projectDetails.ProjectID,
    "Name":$scope.projectDetails.Name,
    "BuildingID":$scope.projectDetails.BuildingID,
    "StartDate":$scope.projectDetails.StartDate,
    "EndDate":$scope.projectDetails.EndDate,
    "Status":$scope.projectDetails.Status,
    "ContactPerson":$scope.projectDetails.ContactPerson,
    "Contractor":$scope.projectDetails.Contractor,
    "ProjectManager":$scope.projectDetails.ProjectManager,
    "Works": $scope.projectDetails.works,
    "Comments":$scope.updatecomments,
    };
    
    $http.post("https://happybuildings.sim.vuw.ac.nz/api/sooleandr/update.project.json", updateproject).then(
      function success(){
        alert("Project Successfully Posted");
        },
        function error(){
          alert("Error: Couldn't post to server");
        }
    )
};

它发布得非常好,但它目前覆盖了 cmets。我希望能够添加新评论并仍然保留所有过去的 cmets。所以我希望能够将 cmets 推送/添加到完整的 POST.JSON 数组中。 希望这更有意义

【问题讨论】:

  • 请添加输入 JSON 样本和所需输出样本
  • 您要删除旧数组并插入全新的元素吗?我无法理解您从问题中需要的逻辑
  • 如何从 JSON 文件中检索现有的 cmets?可能是您的 JSON 文件未正确读取,并且您的代码假定现有的 cmets 永远不存在。
  • 我的 JSON 文件的 POST 和 GET 一切正常。我希望能够向现有 JSON 文件添加新评论。我们只获得了更新整个项目的链接,因此我需要保持所有项目信息相同,并能够在现有数据中添加新评论。

标签: javascript arrays json angularjs


【解决方案1】:

好的,查看提供的代码后更新答案。

您可能认为 $scope.projectDetails.Comments 是一个 JSON 字符串,而实际上......它是实际的 Comments 数组。

我会试试这个 addnewcomment 功能:

//ADDING NEW COMMENTS
//add new comment within project
$scope.updatecomments = undefined;
$scope.addnewcomment = function() {
    $scope.updatecomments = $scope.updatecomments || $scope.projectDetails.Comments;
    $scope.updatecomments.push({
        "Author": "test",
        "Text": $scope.NewComment
    })
}

IF 它恰好是一个 JSON 字符串(极不可能),那么我会将 combine 函数更新为:

$scope.combineComments = function (){
    var jsonStr = $scope.projectDetails.Comments;
    var obj = JSON.parse(jsonStr);
          
    obj.push({"Author":"Test","Text":$scope.NewComment});
          jsonStr = JSON.stringify(obj);
    }
}

编辑 我正在添加我原来的另一个答案,因为当没有更新的 cmets 时事情可能会中断

//ADDING NEW COMMENTS
//add new comment within project
$scope.addnewcomment = function() {
  $scope.projectDetails.Comments.push({
        "Author": "test",
        "Text": $scope.NewComment
    })
}

然后在POST中,改为:

"Comments":$scope.projectDetails.Comments

【讨论】:

  • 当我运行 combineComments 函数时,它只显示新的评论。它覆盖了所有旧的 cmets
  • 我尝试了第一个,但它破坏了代码。第二个我很困惑,因为我在我的 POST 函数中添加了什么?我尝试使用 jsonStr 发布,但它没有发布任何内容。
  • 如果第一个破坏了代码,那是因为在定义 addnewcmets 函数时 $scope.projectDetails 为空。现在知道了这一点,我改变了答案来解决这个问题。忽略我回答的整个组合部分,因为您现在意识到 $scope.projectDetails.Comments 不是 不是 JSON 字符串
  • 非常感谢!你是救命稻草!
  • 我很高兴它成功了,但我想到了没有任何新 cmets 的情况,这会破坏代码。我已经编辑了我认为是最佳解决方案的答案
【解决方案2】:

我已经想出了如何将两者结合起来

$scope.combinecomments = [];
   $scope.combine = function (){
     $scope.combinecomments.push($scope.projectDetails.Comments);
     $scope.combinecomments.push($scope.updatecomments);
   }

除了现在它不会发布组合的 cmets

$scope.ProjectID='$scope.ProjectID';
    $scope.Name = '$scope.Name';
    $scope.BuildingID = '$scope.BuildingID';
    $scope.StartDate = '$scope.StartDate';
    $scope.EndDate = '$scope.EndDate';
    $scope.Status = '$scope.Status';
    $scope.ContactPerson = '$scope.ContactPerson';
    $scope.Contractor ='$scope.Contractor';
    $scope.ProjectManager = '$scope.ProjectManager';
    $scope.Works = '$scope.works';
    $scope.Comments ='$scope.comments';

$scope.updateProject = function (projectDetails){
  
  var updateproject = {
    "ProjectID":$scope.projectDetails.ProjectID,
    "Name":$scope.projectDetails.Name,
    "BuildingID":$scope.projectDetails.BuildingID,
    "StartDate":$scope.projectDetails.StartDate,
    "EndDate":$scope.projectDetails.EndDate,
    "Status":$scope.projectDetails.Status,
    "ContactPerson":$scope.projectDetails.ContactPerson,
    "Contractor":$scope.projectDetails.Contractor,
    "ProjectManager":$scope.projectDetails.ProjectManager,
    "Works": $scope.projectDetails.works,
    "Comments":$scope.combinecomments,
    };
    
    $http.post("https://happybuildings.sim.vuw.ac.nz/api/sooleandr/update.project.json", updateproject).then(
      function success(){
        alert("Project Successfully Posted");
        },
        function error(){
          alert("Error: Couldn't post to server");
        }
    )
};

它成功发布了项目,但 cmets 除外。它似乎不喜欢我的组合数组。当我发布$scope.updatecomments 时,它会发布,但不会发布$scope.combinecomments

我会为此提出一个新问题。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2019-08-30
    • 2014-03-05
    • 2019-06-15
    • 1970-01-01
    • 1970-01-01
    • 2021-12-30
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多