如何使用angularjs使列可编辑？

Question

使用angularjs时是否可以使表格列可编辑？我有这张桌子：

<table>
    <thead>
    <tr class="header">
        <th>id</th>
        <th>files</th>
    </tr>
    </thead>
    <tbody ng-repeat="person in persons">
    <tr>
        <td>{{person.id}}</td>
        <td>{{person.fileNames)}}</td>
    </tr>
    </tbody>
</table>

所以我有一个$ scope.fileNames，这是一个包含每人文件名的数组，例如：

["Koala.jpg","Tulips.jpg","Tulips.jpg","Hydrangeas.jpg","Lighthouse.jpg","Chrysanthemum.jpg"]

我想让第二列可供用户编辑，以便他可以更改/删除文件，我该如何实现？

Answer 1

使用contentEditable

<table>
    <thead>
    <tr class="header">
        <th>id</th>
        <th>files</th>
    </tr>
    </thead>
    <tbody ng-repeat="person in persons">
    <tr>
        <td contentEditable>{{person.id}}</td>
        <td contentEditable>{{person.fileNames)}}</td>
    </tr>
    </tbody>
</table>