ng-repeat 中的 ng-model 不起作用

Question

这是我的标记：

<table class="table table-striped hover-table" ng-repeat="item in optionsData" id="optionsTable">
    <thead>
            <tr>
                <th class="trigger-man" ng-model="showOptions" ng-click="showOptions = !showOptions">{{item.reportName}}<span class="pull-right glyphicon" ng-class="{'glyphicon-chevron-right': !showOptions, 'glyphicon-chevron-down': showOptions}"></span></th>
            </tr>
        </thead>
      <tbody ng-show="showOptions">
        <tr ng-if="item.hasOptions == false">
            <td>No options available.</td>
        </tr>
        <tr ng-if="item.hasOptions == true && option.title.length > 0" ng-repeat="option in item.reportOptions">
            <td><div class="alert alert-info"><strong>{{option.title}}</strong></div><br>
            <!--If text or select-->
                <div class="form-group" ng-repeat="input in option.inputs" ng-if="option.type == 'text' || optionType == 'select'">
                    <label for="{{input.label}}" class="col-md-3 control-label">{{input.label}}</label>
                    <div class="col-md-7 col-shiv">
                      <input class="form-control" type="{{option.type}}" placeholder="{{input.label}}" name="{{input.label}}" ng-model="optionsForm.{{input.value}}" />
                    </div>
                </div>
             <!-- if radio or checkbox-->
             <div class="form-group" ng-repeat="input in option.inputs" ng-if="option.type == 'radio' || option.type == 'checkbox'">
          <label for="{{input.label}}" class="col-md-3 control-label">{{input.label}}
            <input type="{{option.type}}" name="{{input.label}}" id="{{input.label}}" value="{{input.value}}" ng-model="optionsForm.{{input.value}}">
            </label>

        </div>
            </td>
        </tr>

      </tbody>
    </table>

这是我的 JSON:

{
"code": 0,
"message": "",
"data": {
    "reports": [{
        "reportID": 16,
        "reportName": "Comprint",
        "hasOptions": true,
        "reportOptions": [{
            "title": "Comprint - sections to print",
            "type": "checkbox",
            "inputs": [{
                "label": "Some Interests \/ Some Map Coordinates",
                "value": "comprint_module_interests_coords",
                "name": "Comprint_modules[]",
                "checked": true
            }, {
                "label": "Some Components",
                "value": "comprint_module_components",
                "name": "Comprint_modules[]",
                "checked": true
            }, {
                "label": "Organizational Focus",
                "value": "comprint_module_organizationalfocus",
                "name": "Comprint_modules[]",
                "checked": true
            }, {
                "label": "Some Perspectives",
                "value": "comprint_module_perspectives",
                "name": "Comprint_modules[]",
                "checked": true
            }, {
                "label": "Work Styles",
                "value": "comprint_module_workstyles",
                "name": "Comprint_modules[]",
                "checked": true
            }, {
                "label": "Log",
                "value": "comprint_module_log",
                "name": "Comprint_modules[]",
                "checked": true
            }]
        }, {
            "title": "Comprint - sort type",
            "type": "radio",
            "inputs": [{
                "label": "Sort In Order Selected",
                "value": "default",
                "name": "Comprint_sort_type",
                "checked": true
            }, {
                "label": "Sort Last Names Alphabetically",
                "value": "alpha_lastname",
                "name": "Comprint_sort_type",
                "checked": false
            }]
        }, {
            "label": "Comprint - Comparison Print Person",
            "name": "Comprint_person",
            "type": "select",
            "options": [{
                "text": "yes",
                "value": "yes",
                "selected": false
            }, {
                "text": "no",
                "value": "no",
                "selected": true
            }]
        }, {
            "label": "Comprint - Dictionary Page",
            "name": "Comprint_dictionary_page",
            "type": "select",
            "options": [{
                "text": "yes",
                "value": "yes",
                "selected": true
            }, {
                "text": "no",
                "value": "no",
                "selected": false
            }]
        }, {
            "label": "Comprint - Mask Names",
            "name": "Comprint_masknames",
            "type": "select",
            "options": [{
                "text": "yes",
                "value": "yes",
                "selected": false
            }, {
                "text": "no",
                "value": "no",
                "selected": true
            }]
        }]
    }]
}
}

一切正常，除了我需要在操作结束时收集数据并且我需要将特定标识符设置为 ng-model（例如 optionsForm.{{input.value}}），以及我不断收到上面代码的语法错误。谁能告诉我我做错了什么？

Answer 1

正确的语法是：

ng-model="optionsForm[input.value]"

这是 bracket notation，它允许您通过变量名访问对象属性。

Answer 2

您需要做几件事：首先 - 删除您的 id="optionsTable"。你重复一遍，id 必须是唯一的。其次 - 你只需要将它绑定到 input.value:

<input class="form-control" type="{{option.type}}" placeholder="{{input.label}}" name="{{input.label}}" ng-model="input.value" />

在这里查看我的 plunker： http://plnkr.co/edit/zh8P0Kpc1d3fOwE9xCod

ng-repeat 中的 ng-model 不起作用

ng-model inside ng-repeat doesn't work

angularjs

angularjs-ng-repeat

angular-ngmodel