解析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。 如果您打算將角度進一步移動，則是綁定和構建界面的更好選擇。

您也可以閱讀此內容 。