Angular UI-Grid下拉菜单不捕捉变化
问题描述:
我是新的角度ui网格。Angular UI-Grid下拉菜单不捕捉变化
我想实现一个内联编辑下拉框,我按照下面的教程(性别列):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
正如你可以在图片中看到,在红色的行意味着它的脏行(编辑),但我有下拉编辑的行不以红色意味着它的没有被编辑,也不能保存。
答
我发现了一种更容易实现我想要的方式。
name: app.localize('Roles'),
field: 'getRoleNames()',
minWidth: 160
editableCellTemplate: 'ui-grid/dropdownEditor',
editDropdownValueLabel: 'displayName',
editDropdownIdLabel: 'displayName'
editDropdownValueLabel是设置否则会显示“未定义”作为图像显示在下面
Example of dropdown undefined options
editDropdownIdLabel的选项值是否则显示所选择的选项的值将显示ID如下图所示
下面的代码是从数据库中获取数据:
vm.userGridOptions.columnDefs[3].editDropdownOptionsArray = result.data.items;