Question

我希望能够单击表格上的按钮并更新行信息。我有后端所有设置来做到这一点。我只是无法进入由角度生成的表格。这是我的html模板：

<br />
<table id="recordTable" border="1px">
    <tr><td ng-repeat="column in columns"><strong>{{column.column_name}}</strong></td>          </tr>
    <tr ng-repeat="record in records">
        <td ng-repeat="cell in record.cells">  {{cell}}  </td>
        <td><button ng-click="delete($index)">Delete</button></td>
        <td><button ng-click="update($index)">Update</button></td>
    </tr>
</table>
<br />

当我调用函数update($index)时，我希望能够将当前用{{column.column_name}}填充的文本转换为文本输入，并将{{column.column_name}}作为默认文本。我在文档中找不到任何内容。有什么想法吗？

Answer 1

我对record.cells数组略有改动，现在是[{value : 'Value1'},{value : 'Value2'}]

<table id="recordTable" border="1px">
    <tr>
        <td ng-repeat="column in columns">
            <strong>{{column.column_name}}</strong>
        </td>
    </tr>
    <tr ng-repeat="record in records">
        <td ng-repeat="cell in record.cells">
          <span ng-show="mode != 'edit'">{{cell.value}}</span>
          <input ng-show="mode == 'edit'" ng-model="cell.value" />
        </td>
        <td><button ng-click="delete($index)">Delete</button></td>
        <td>
          <button ng-show="mode != 'edit'" ng-click="mode = 'edit'">Update</button>
          <button ng-show="mode == 'edit'" ng-click="mode = null">Save</button>
        </td>
    </tr>
</table>

演示：Plunker

在按钮单击时以角度创建表格中的文本框

1 个答案: