Javascript 添加动态字段以创建特定的JSON格式

我正在尝试创建一个带有动态字段的表单，以创建一个JSON来发布如下内容

{
"cpu": "1",
"ram": "128",
"env": {
    "envname1": "value1",
    "envname2": "value2"
}
}

虽然我在创建cpu和ram方面没有问题，但我不知道如何创建“envname”和“value”，因为envname应该位于动态添加的字段中，第一列和第二列中的值

我也不能将常规字段和动态字段放在一个范围内

请看一看 cpu和ram字段被忽略。当我改变

    $scope.inputs = [{id: 'choice1'}];

到

---

动态字段将被忽略。如何使范围内的所有内容都以JSON形式提交整个表单？

您将

输入

模型视为既是

数组

又是

对象

我建议您在

输入

模型上创建一个

变量

属性，并在该属性上推/拼接

我已更新了您的相关代码，如下所示：

JavaScript：

var app = angular.module('myApp', []);

app.controller('MyCtrl', ['$scope', function ($scope) {
    $scope.inputs = { variable: [] };

$scope.addInput = function(){
    $scope.inputs.variable.push({name:'', value:''});
}

$scope.removeInput = function(index){
    $scope.inputs.variable.splice(index,1);
}
}]);

HTML：

<div ng-app="myApp" ng-controller="MyCtrl">

        <input type="text" ng-model="inputs.cpu" />cpu<br />
        <input type="text" ng-model="inputs.ram" />ram

    <div ng-repeat="input in inputs.variable">
        <input type="text" ng-model="input.name" />
        <input type="text" ng-model="input.value" />
        <button ng-click="removeInput($index)">Remove</button>
    </div>
    <button ng-click="addInput()">add input</button>
    <br />
<strong><label for="userDebugText">JSON:</label></strong>
<textarea id="userDebugText">{{inputs|json}}</textarea>
</div>

cpu

内存
去除
添加输入


JSON:
{{输入| json}

您能提供一些关于什么是动态的详细信息吗<代码>cpu，

ram

和

环境

？仅

env

？（根据您的想法）为什么每个env属性显示两个文本字段？如下：$scope.toSend={}$scope.toSend.inputs=[]；是的，这就是即将发生的事情。“推送”将项目添加到数组中。如果声明$scope.inputs={id:'choice1'}；这不是一个数组。其中as$scope.inputs=[{id:'choice1'}]；是一个数组。因此，对非数组的内容进行“推送”不会增加值。使用dynamic，我的意思是，

env

的输入字段可以通过单击按钮来添加/删除。用户可以以

envname

和

value

的形式添加任意多的

env

值。Thx这是向前迈出的一步，但我还需要上述格式的JSON，

env

的键/值必须来自两个输入字段。因此，在您的小提琴

{“variable”：[{“name”：“value”，“value”：“}]，“cpu”：“1”，“ram”：“8”}

name

应该是用户提交表单时左栏位的输入，右栏位的输入是

value

，处理您的模型以匹配您想要的格式json现在不再嵌套，我仍然不知道如何在没有

[

但

{

的情况下将多行添加到

env

。为此，我将使用angular.copy.thx

<div ng-app="myApp" ng-controller="MyCtrl">

        <input type="text" ng-model="inputs.cpu" />cpu<br />
        <input type="text" ng-model="inputs.ram" />ram

    <div ng-repeat="input in inputs.variable">
        <input type="text" ng-model="input.name" />
        <input type="text" ng-model="input.value" />
        <button ng-click="removeInput($index)">Remove</button>
    </div>
    <button ng-click="addInput()">add input</button>
    <br />
<strong><label for="userDebugText">JSON:</label></strong>
<textarea id="userDebugText">{{inputs|json}}</textarea>
</div>