Question

对于其中一个列单元格，我想使用可编辑文本区域。这是我的代码片段。

    { field: 'Tasks', enableCellEdit: true, cellTooltip: true, headerTooltip: true, width: '50%' , enableFiltering: false,
          editableCellTemplate: '<textarea style="width:100%" ng-class="\'colt\' + col.index" ng-input="COL_FIELD" ng-model="COL_FIELD"></textarea>'},

但textarea并不接受任何更改/编辑。我相信与模特有冲突，有人能指出我正确的方向。

有人可以解释一下如何做到这一点吗？

我想要的只是我的单元格的可编辑文本区域输入。

以下是我的代码http://plnkr.co/edit/Fpqsdthu4FhyUoD5gGcL?p=preview的Plunkr 谢谢，

Answer 1

基于此处的默认模板： https://github.com/angular-ui/ui-grid/blob/master/src/features/edit/templates/cellEditor.html

请尝试使用以下内容代替您的模板：

<textarea ng-class="'colt' + col.uid" ui-grid-editor ng-model="MODEL_COL_FIELD"></textarea>

似乎wiki中模板的主要问题是使用COL_FIELD作为ng-model。

Answer 2

将其添加到列配置。

editableCellTemplate:
  `<div>
    <textarea ng-class="'colt' + col.uid" ui-grid-editor ng-model="MODEL_COL_FIELD"></textarea>
  </div>`

Answer 3

我想要的只是我的单元格的可编辑文本区域输入。

然后你应该更好地使用他们提供的功能。 Editable

正如您在教程中看到的那样，还有许多回调函数需要考虑。

这是plunker。我认为你编写的cellEdit和ui-grid的实际编辑功能是冲突的。

ps：在第一个链接的页面上，您可以找到许多回调函数，例如cellEditableCondition和afterCellEdit

ui-grid editableCellTemplate Textarea编辑文本

3 个答案: