angularjs动态复选框。如何扩展表格并提交？

Question

我正在尝试为一组用户动态创建表单，并且每个用户都会显示其可用选项。

到目前为止一切顺利。问题在于，根据一个选项的选择，需要显示额外的textinput并将其附加到选项本身。

我应该如何“模型化”这个额外选项？当我尝试使用user.SelectedOption [option.Id] .ExtraInfo时，输入字段将被禁用。

任何人都有想法（或更好的解决方案）？

<div ng-repeat="user in users">
    <h1>{{user.UserName}}</h1>
    <table>
        <tr ng-repeat="options in user.Options>
            <th>{{option.Name}}</th>
            <td><input type="checkbox" ng-model="user.SelectedOption[option.Id]" /><td>
            <td>
                <p ng-show="user.SelectedOption[option.Id] === true">
                    <label>Remarks</label>
                    <input type="text" ng-model="????" >
                </p>
            </td>
        </tr>
        <td>
    </table>
</div>



<button type="primary" ng-click="save()">save<button>

用户对象看起来像这样（简化）

{
    "users": [
        {
            "Id": 1,
            "UserName": "testname",
            "Options": [
                {
                    "id": 1,
                    "Name": "strawberry"
                },
                {
                    "id": 2,
                    "Name": "chocolate"
                }
            ]
        },
         {
            "Id": 2,
            "UserName": "testname2",
            "Options": [

                {
                    "id": 2,
                    "Name": "chocolate"
                }
            ]
        }
    ]
}

至于回应，我想要这样的东西

{
"selectedOptions" : [
                        {
                            "UserId" : 1,
                            "Options" : [
                                            {
                                                "id": 1,
                                                "Selected": false,
                                                "Remarks" : null
                                            },
                                            {
                                                "id": 2,
                                                "Selected": true,
                                                "Remarks" : "Lorem Ipsum"
                                            }
                                        ]
                        },
                                                {
                            "UserId" : 2,
                            "Options" : [

                                            {
                                                "id": 2,
                                                "Selected": true,
                                                "Remarks" : "Lorem Ipsum"
                                            }
                                        ]
                        }
                    ]

}

---实际上我能用这个创建一个有点工作的形式：

{
    "users": [
        {
            "Id": 1,
            "UserName": "testname",
            "Options": [
                {
                    "id": 1,
                    "Name": "strawberry",
                    "isSelected" : false,
                    "Remarks" : ""
                },
                {
                    "id": 2,
                    "Name": "chocolate",
                    "isSelected" : false,
                    "Remarks" : ""
                }
            ]
        },
        {
            "Id": 2,
            "UserName": "testname2",
            "Options": [
                {
                    "id": 2,
                    "Name": "chocolate",
                    "isSelected" : false,
                    "Remarks" : ""
                }
            ]
        }
    ]
}

和

<div ng-repeat="user in users">
    <h1>{{user.UserName}}</h1>
    <table>
        <tr ng-repeat="options in user.Options>
            <th>{{option.Name}}</th>
            <td><input type="checkbox" ng-model="options.isSelected" /><td>
            <td>
                <p ng-show="options.isSelected === true">
                    <label>Remarks</label>
                    <input type="text" ng-model="options.Remarks" >
                </p>
            </td>
        </tr>
        <td>
    </table>
</div>



<button type="primary" ng-click="save()">save<button>

但不知怎的，我不认为这是处理响应对象的“正确”方法。