Angular UI-Grid下拉菜单不捕捉变化

Question

我是新的角度ui网格。

我想实现一个内联编辑下拉框，我按照下面的教程（性别列）：http://ui-grid.info/docs/#/tutorial/201_editable，我修改它通过使用新的cshtml页面（如下图所示），因为我想从数据库设置选项，而不是手动输入选项。

下面的代码是我实现的下拉框：

name: app.localize('Roles'), 
field: 'getRoleNames()', 
minWidth: 160, 
editableCellTemplate: '~/App/common/views/users/roleDropDownList.cshtml' 

这里是roleDropDownList.cshtml

的代码

<div ng-controller="common.views.users.index as vm"> 
    <select> 
     <option ng-repeat="role in vm.roles">{{role.displayName}}</option> 
    </select> 
</div> 

现在我能够选择的选项，但它像当我选择其中一个选项时不捕获更改。

这里是例子： DropDown sample

正如你可以在图片中看到，在红色的行意味着它的脏行（编辑），但我有下拉编辑的行不以红色意味着它的没有被编辑，也不能保存。

Answer 1

我发现了一种更容易实现我想要的方式。

name: app.localize('Roles'), 
field: 'getRoleNames()', 
minWidth: 160 
editableCellTemplate: 'ui-grid/dropdownEditor', 
editDropdownValueLabel: 'displayName', 
editDropdownIdLabel: 'displayName' 

editDropdownValueLabel是设置否则会显示“未定义”作为图像显示在下面

Example of dropdown undefined options

editDropdownIdLabel的选项值是否则显示所选择的选项的值将显示ID如下图所示

Showed Id

下面的代码是从数据库中获取数据：

vm.userGridOptions.columnDefs[3].editDropdownOptionsArray = result.data.items;