UI 网格 cellTemplate editableCellTemplate 不会失去焦点

Question

我正在使用 angular-ui-grid 并尝试显示几个单元格模板的组合。我需要一些网格单元来根据实体的属性更改类/颜色。我需要其他单元格来显示一个可以打开/关闭的按钮，并且如果行实体是“属性”，则仅针对某些行和单元格显示。我想出了一个 cellTemplate 和一个可编辑的CellTemplate 的组合来完成这个。一切似乎都在工作，除了当我单击带有输入字段的单元格的焦点时，它不会失去焦点，并且我收到错误语法错误：令牌'未定义'不是列空的主要表达式表达式 [row.entity[] 从 [row.entity[] 开始。当我编辑单元格时，它会进入输入模式，我可以输入数据，当我点击退出时，它不会失去焦点，它会保持在编辑模式。如果我在网格上移动滚动条，它将失去焦点

这是我的单元格模板：

<div ng-if="row.entity.resultType === 'ATTRIBUTE'  &&  row.entity[col.colDef.field] == 'Pass'" ng-class="grid.appScope.getClassFromTemplate(row, col)">
<button class="ui-grid-cell-btn" type="button"  ng-click="grid.appScope.togglePass(row, col)" >
    <span class="glyphicon glyphicon-ok green"></span>
</button>
</div>
<div ng-if="row.entity.resultType === 'ATTRIBUTE' && row.entity[col.colDef.field] != 'Pass'" ng-class="grid.appScope.getClassFromTemplate(row, col)">
<button class="ui-grid-cell-btn" type="button" ng-click="grid.appScope.togglePass(row, col)" >
    <span class="glyphicon glyphicon-remove red"></span>
</button>
</div>

//what should this template look like?... should be just standard template to display ui grid data
<div ng-if="row !== null && row.entity.resultType !== 'ATTRIBUTE'" class='ui-grid-cell-contents'>
    {{MODEL_COL_FIELD}}
</div>

还有我的可编辑单元格模板

<div ng-if="row.entity.resultType === 'ATTRIBUTE'  && row.entity[col.colDef.field] == 'Pass'" class='ui-grid-cell-contents'>
<button class="ui-grid-cell-btn" type="button"  ng-click="grid.appScope.togglePass(row, col)" >
    <span class="glyphicon glyphicon-ok green"></span>
</button>
</div>
<div ng-if="row.entity.resultType === 'ATTRIBUTE' && row.entity[col.colDef.field] != 'Pass'" class='ui-grid-cell-contents'>
<button class="ui-grid-cell-btn" type="button"  ng-click="grid.appScope.togglePass(row, col)" >
    <span class="glyphicon glyphicon-remove red"></span>
</button>
</div>
<div ng-if="row.entity !== null && row.entity.resultType !== 'ATTRIBUTE'" >
<form name="inputForm">
    <input style="background-color: white; !important; color: black !important" type='text' ng-class="'colt' + col.uid" ui-grid-editor ng-model='MODEL_COL_FIELD'>
</form>
</div>

我已经对所有内容进行了空检查，但仍然收到错误，很困惑。请帮忙！

Answer 1

您的问题可能是以下任何一种：

1. '===' 运算符
   将“===”替换为“==”。 Angular 期望使用 '==' 运算符的语句。

   Why is AngularJS complaining about an unexpected token in an expression when I try to use a string?

2. 尝试使用ng-show 或ng-hide 代替ng-if
   我之前使用ng-if 遇到过问题，因为ng-if 创建了一个可能导致该错误的子范围。

更多详情请看blog