ui-grid AngularJS中的标题下拉列表

Question

我正在尝试在ui-grid中的某个字段的标头中获取下拉值。对于同一个字段，我有每行正常工作的下拉列表。根据标题下拉列表选择，应选择行中的每个下拉列表值。这是我的plunker链接。有人可以帮忙吗？

这是blog！

var jsonDef = { name: 'Status', field: 'Status', width: 150, 
editType: 'dropdown', 
editableCellTemplate: 'ui-grid/dropdownEditor', 
headerCellTemplate: '<div class="ui-grid-cell-contents header-tcsi"><select 
ng-required = "true" ng-options="options.id as options.type for tcsiOption 
in grid.appScope.MainCtrl" ng-model="grid.appScope.selectedTCSI"></select> 
</div>',
editDropdownIdLabel: 'id', 
editDropdownValueLabel: 'type',
filter: { 
type: uiGridConstants.filter.SELECT, 
condition: uiGridConstants.filter.EXACT } 
};

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

Answer 1

您错误地使用了ng-options。如果您想从appScope访问某些内容，请将其附加到控制器$scope。然后，您可以更改模板，使用如下选项：

 headerCellTemplate: '<div class="ui-grid-cell-contents header-Status"><select ng-required = "true" ng-options="options.id as options.type for options in grid.appScope.dropdownoptions" ng-change= "grid.appScope.selectionChanged()"ng-model="grid.appScope.selectedStatus"></select> </div>'

注意ng-options：

ng-options="options.id as options.type for options in grid.appScope.dropdownoptions"

您编写代码的方式，您需要在下拉列表更改时进行侦听，然后更新网格中的值。检查 Updated Plnkr 表示工作示例。