Javascript 角度：单击后，将输入字段文本添加到数组中

首先，从这个开始有点困惑。我有一个简单的表，其中的内容从数据库中拉入，并使用Angular注入DOM

该表由一个选项及其值组成。我希望用户能够编辑这些值，然后单击一个“保存”按钮，在这里我可以用详细信息对我的后端进行http调用

我已经完成了基本工作，单击一个按钮，输入字段将替换表格单元格内容：

单击“编辑”：

当单击“取消”时，它会返回-因此这一切都正常

所以这一点我无法理解，当我按下update时，我想创建一个数组（json？），在那里我可以使用http发送到某处

我需要数组/json中的每个对象都包含“option”和“value”的东西，这样我就可以在数据库中匹配它们

我的HTML：

<div ng-hide="loading" class="table-responsive">    
    <table class="table table-striped table-compact table-bordered">
        <thead>
            <tr>
                <th>Option</th>
                <th>Value</th>
            </tr>
        </thead>
        <tbody>
            <tr ng-repeat="setting in settings">
                    <td><< setting.option >> <i class="fa fa-question pull-right pointer" tooltip="<< setting.description >>" ></i></td>
                    <td ng-switch="status">
                                <input ng-switch-when="editable" type="text" class="form-control" value="<< setting.value >>" />
                                <span ng-switch-when="uneditable"><< setting.value >></span>
                    </td>
            </tr>
        </tbody>
    </table>
</div>


<div ng-hide="loading" ng-switch="status">
        <button ng-switch-when="uneditable" ng-click="edit()" class="btn btn-sm btn-info">Edit</button>
        <button ng-switch-when="editable" ng-click="save()" class="btn btn-sm btn-success">Update</button>
        <button ng-switch-when="editable" ng-click="cancel()" class="btn btn-sm btn-danger">Cancel</button>
</div>

---

有人有什么想法吗？我觉得这与使用ng模型有关？

在您的表中，第二列在编辑模式下有以下输入元素标记：

<input ng-switch-when="editable" type="text" class="form-control"
 value="<< setting.value >>" />

ng model

将负责显示该输入的值，并且由于双向数据绑定，输入到输入中的值将存储回setting.value

这意味着，当您在文本框中输入内容时，AngularJS将自动更新

$scope.settings

。您不必编写任何额外的代码来确保返回值。这就像已经单击了更新按钮并保存了数据——只是没有单击，但数据仍然保存了

唯一的缺点是，当您单击“取消”时，旧值不再可用（因为在文本中键入内容时，值就会更新）。切换到编辑模式之前，可以将

$scope.settings

的初始值存储到另一个变量中。这样，当您单击“取消”时，仍然会保留旧值。

啊，真棒的干杯。>是因为我正在使用一个使用{{}}的框架-忘记提到对不起。将研究如何将其存储在变量中，但现在确实有意义！

<input ng-switch-when="editable" type="text" class="form-control"
 value="<< setting.value >>" />

<input ng-switch-when="editable" type="text" class="form-control"
 ng-model="setting.value" />