如何处理 ui-grid 的动态下拉列表? [英] How to handle dynamic dropdowns for ui-grid?

问题描述

• 我正在尝试向类型"列添加一个下拉列表，我可以在其中选择 x、y 或 z.
• 当我在下拉列表中选择 x、y 或 z 时，x、y、z 列的复选框不会改变.

• 但是，当我选中 x、y 或 z 复选框时，类型"列中的下拉值会发生变化

• I’m trying to add a dropdown to my "Type" column where I can select either x, y, or z.
• When I select x, y, or z in the dropdown, the checkboxes for the x, y, z columns don’t change.

• However, when I check the either x,y or z checkboxes, the downdrop value in the "Type" column changes

{ name: 'Type', displayName: 'Type', width: '7%',field:'getType()',  editableCellTemplate: 'ui-grid/dropdownEditor', 
         editDropdownValueLabel: 'Type', enableCellEdit: true },

这是我的 plunker:https://plnkr.co/edit/mzSaxh3PVvqvfJtAYKkU?p=preview

Here's my plunker: https://plnkr.co/edit/mzSaxh3PVvqvfJtAYKkU?p=preview

推荐答案

应该这样做...

$scope.updateType = function (entity, type) {
  entity.xBox = type == 'x';
  entity.yBox = type == 'y';
  entity.zBox = type == 'z';
}

editableCellTemplate: '<select ui-grid-edit-dropdown ng-init="result=row.entity.getType()" ng-options="type for type in [\'x\',\'y\',\'z\']" ng-model="result" ng-change="grid.appScope.updateType(row.entity, result)"></select>'

您的 Plunker 已更新，https://plnkr.co/edit/SbZkKubGtrzWYJhc8Qv9?p=preview.

Your Plunker updated, https://plnkr.co/edit/SbZkKubGtrzWYJhc8Qv9?p=preview.

这篇关于如何处理 ui-grid 的动态下拉列表?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！