javascript - UI-Grid 在单元格下拉列表中显示未定义

Question

当单元格中有 Angular ui 网格的下拉菜单时，所有值都显示为未定义。这是我的 Controller 中的网格设置。

var status = [
        { id: 1, type: 'Closed' },
        { id: 2, type: 'Pending' },
        { id: 3, type: 'Open' }
    ];

    // grid setup
    $scope.gridStore = {
        enableSorting: true,
        enableFiltering: true,
        flatEntityAccess: true,
        fastWatch: true,
        enableHorizontalScrollbar: 1,
        enableCellSelection: true,
        enableCellEditOnFocus: true,
        columnDefs: [
            { name: 'Number', field: 'Number', width: 150, pinnedLeft: true, enableCellEdit: false },
            { name: 'Name', field: 'Name', width: 300, pinnedLeft: true, enableCellEdit: false },
            { name: 'Date', field: 'Date', width:500 },
            { name: 'Status', field: 'Status', width: 500, editType: 'dropdown', editableCellTemplate: 'ui-grid/dropdownEditor', editDropDownValueLabel: 'type', editDropdownOptionsArray: status, filter: { selectOptions: status, type: uiGridConstants.filter.SELECT, condition: uiGridConstants.filter.EXACT } }
        ]
    };

Answer 1

我假设您已经解决了自己的问题？

另外，为了将来的引用，我在处理 ui 网格上的下拉菜单时使用的一个巧妙的功能是，我将它们视为始终是动态的，因此我不再需要处理 OptionsArray 和过滤器(这对于动态数据来说是一个痛苦) )。

当您计划扩展 Angular ui 网格方面的知识时，这只是需要研究的内容。

HTML:

<div ui-grid="gridOptions" ui-grid-edit class="grid"></div>

Controller :

$scope.gridOptions = {
    enableSorting: true,
    enableFiltering: true,
    enableCellEditOnFocus: true,
    columnDefs: [
      { field: 'name',
        sort: {
          direction: 'desc',
          priority: 1
        }
      },
      { field: 'gender', editType: 'dropdown', enableCellEdit: true,
          editableCellTemplate: 'temp.html' },
      { field: 'company', enableSorting: false }
]};

temp.html:

<div>
    <select ng-model="row.entity.gender" data-ng-options="d as d.type for d in genderType">
        <option value="" selected disabled>Choose Gender</option>
    </select>
</div>