angular-ui-grid 中的单元格模板无法正常工作答案

【问题标题】：Celltemplate in angular-ui-grid is not working properlyangular-ui-grid 中的单元格模板无法正常工作
【发布时间】：2017-07-01 13:50:22
【问题描述】：

我正在使用UI-Grid 在我的 Angular 应用程序中显示出勤数据。我已经使用了三个存储在单独数组中的出勤选项。

$scope.gridOptions.data.attendance=[{'persent'},{'absent'},{'leave'}];

学生人数如下：

$scope.gridOptions.data=students;//from ajax request

现在我想在出勤列中显示下拉菜单。

我还想将 persent 显示为默认选择的选项。所以我在 celltemplate 中使用了 ng-options，代码如下：

 $scope.gridOptions = {
        columnDefs: [
           {
                name: "stdattendance",
                displayName: "Attendance",
                width: '20%',
                cellClass: 'grid-align',
                cellTemplate:'<select ng-model="row.entity.stdattendnce" ng-init="row.entity.stdattendnce=row.entity.attendance[0]"
                ng-options="s as s.description for s in row.entity.attendance track by s.id"></select>'
               }]

我面临的问题是：

1-在显示的网格中选择默认选项 persent 而不滚动，而在网格的下部则未选择。

2-当我选择一个选项时，它也会在一些较低的网格中随机选择。

我无法弄清楚这种奇怪的行为。有人可以帮忙吗？

【问题讨论】：

标签： javascript angularjs angular-ui-grid

【解决方案1】：

ng-init="row.entity.stdattendnce=row.entity.attendance[0] 错字会导致问题吗？在 plunkr 中看到这一点会有所帮助。这是角度 plunkr：https://plnkr.co/edit/RJZXudKJKBVIKhoxjXW0

<body ng-app="defaultValueSelect"> 
  <div ng-controller="ExampleController"> 
  <form name="myForm"> 
    <label for="mySelect">Make a choice:</label> 
    <select name="mySelect" id="mySelect" 
      ng-options="option.name for option in data.availableOptions track by option.id" 
      ng-model="data.selectedOption"></select> 
  </form> 
  <hr> 
  <tt>option = {{data.selectedOption}}</tt><br/> 
</div> 
</body>

请注意，选定的选项是在范围内设置的，并在模板中使用 ng-model 进行标识。

【讨论】：

我的问题是我在网格中使用这个有问题。