解析json对象并将数据绑定到表单字段

Question

我正在解析一个大的json对象，并且我绑定到的表单中有很多字段。 这是代码http://jsfiddle.net/UfPTd/的一小部分示例。该代码也在下面。 真正的问题是实现这些结果的最佳方法是什么？ 这是应该考虑Angular的地方还是javascript json.parse很好？ 我是否必须使用index []数组括号？ 尝试不使用插件模板。

<form>

        <label>Select Withdrawal Type</label>
            <input type="text" data-label="Withdrawal Type" >

        <label>Plan Name</label>
            <input type="text"  data-label="Plan Name" value=""/>

        <label>Select Participant </label>
            <input type="text" data-label="Participant Name" >

       <label>Address</label>
           <input  type="text" data-label="Address On File"/>




</form>
   var data = {
  "inputs": [
    {
        "DataLabel": "Withdrawal Type",
        "DataGroup": "Participant Information",
        "DataColumn": "WithdrawalType",
        "Value": "full",
        "InternalUse": "1",
        "userDefined": "1"
    },
    {
        "DataLabel": "Plan Name",
        "DataGroup": "Participant Information",
        "DataColumn": "PlanName",
        "Value": "OpenGate Open Architecture 401(k) Plan",
        "InternalUse": "0",
        "userDefined": "0"
    },
    {
        "DataLabel": "Participant Name",
        "DataGroup": "Participant Information",
        "DataColumn": "ParticipantName",
        "Value": "Yosemite Sam",
        "InternalUse": "0",
        "userDefined": "0"
    }        }
    ]
    }


    $('input[data-label="Withdrawal Type"]').attr('value',data.inputs[0].Value);
    $('input[data-label="Plan Name"]').attr('value',data.inputs[1].Value);
    $('input[data-label="Participant Name"]').attr('value',data.inputs[2].Value);

工作示例在此处http://jsfiddle.net/UfPTd/

Answer 1

for(i in data.inputs){
    $('input[data-label="'+data.inputs[i].DataLabel+'"]').attr('value',data.inputs[i].Value);
}

Answer 2

如果要停止仅绑定这些值，则可以使用json.parse。 如果您打算将角度进一步移动，则是绑定和构建界面的更好选择。

您也可以阅读此内容 。