javascript - 按索引更新数组中的 JSON 键值

Question

我正在使用 Angular javascript 来完成一项任务，我需要在点击函数时从数组中更新 JSON 键值。

我有这样的 JSON 结构:-

$scope.jsonObj = {
    "stylesheet": {
        "attribute-set": [{
                "attribute": {
                    "_name": "text-align",
                    "__prefix": "xsl",
                    "__text": "center"
                },
                "_name": "__frontmatter",
                "__prefix": "xsl"
            },
            {
                "attribute": [{
                        "_name": "space-before",
                        "__prefix": "xsl",
                        "__text": "80mm"
                    },
                    {
                        "_name": "line-height",
                        "__prefix": "xsl",
                        "__text": "140%"
                    }
                ],
                "_name": "__frontmatter__title",
                "_use-attribute-sets": "common.title",
                "__prefix": "xsl"
            }
        ],
        "_version": "2.0",
        "__prefix": "xsl"
    }
};

我有一个数组 $scope.textvalue=["center", "80mm","150%"] 。所以这里我想根据index更新JSON的键值__text。意味着我想根据 JSON 和数组中 __text 的索引推送数组详细信息。

我在 controller 中点击按钮时执行此操作。

$scope.save = function(index) {
    $scope.textvalue[index];
    console.log($scope.textvalue);
    $scope.objIndex = $scope.jsonObj.findIndex((obj => obj.__text));
    console.log("Before update: ", $scope.jsonObj[$scope.objIndex]);
    $scope.jsonObj[$scope.objIndex].__text = ? ? ? ;
    console.log("After update: ", $scope.jsonObj[$scope.objIndex]);
}

我做了 $scope.jsonObj[$scope.objIndex].__text = ???;因为我不知道在这里做什么，而且我有一个错误，因为 $scope.jsonObj.findIndex 不是一个函数

建议我一些方法来更新我的 JSON 值。

Answer 1

您可以通过使用 Array.forEach() method 遍历 $scope.jsonObj.stylesheet["attribute-set"] 数组来实现 并分别为每个 attribute 对象/数组更新相关的 "__text" 属性。

• 我使用了 Array#isArray() method 检查迭代的 attribute 属性是 array 还是 object。
• 我将 $scope.textvalue 数组复制到 arr 并使用<强> Array#shift() method 在每次迭代中从 arr 数组中获取相关值。

你的代码应该是这样的:

const arr = $scope.textvalue.slice();
$scope.jsonObj.stylesheet["attribute-set"].forEach(function(a) {
  if (Array.isArray(a.attribute)) {
    a.attribute.forEach(att => att["__text"] = arr.shift());
  } else {
    a.attribute["__text"] = arr.shift();
  }
});

演示:

$scope= {};
$scope.jsonObj = {
  "stylesheet": {
    "attribute-set": [{
        "attribute": {
          "_name": "text-align",
          "__prefix": "xsl",
          "__text": "center"
        },
        "_name": "__frontmatter",
        "__prefix": "xsl"
      },
      {
        "attribute": [{
            "_name": "space-before",
            "__prefix": "xsl",
            "__text": "80mm"
          },
          {
            "_name": "line-height",
            "__prefix": "xsl",
            "__text": "140%"
          }
        ],
        "_name": "__frontmatter__title",
        "_use-attribute-sets": "common.title",
        "__prefix": "xsl"
      }
    ],
    "_version": "2.0",
    "__prefix": "xsl"
  }
};

$scope.textvalue = ["center", "80mm", "150%"];
const arr = $scope.textvalue.slice();

$scope.jsonObj.stylesheet["attribute-set"].forEach(function(a) {
  if (Array.isArray(a.attribute)) {
    a.attribute.forEach(att => att["__text"] = arr.shift());
  } else {
    a.attribute["__text"] = arr.shift();
  }
});
console.log($scope.jsonObj);