Ist es möglich, "Häkchen" in nicht auswählbaren Zeilen zu entfernen?

Question

Wir verwenden ui-Grid v3.1.1 und haben einen bestimmten Anwendungsfall, bei dem ein Raster bestimmte Zeilen auswählbar und andere nicht auswählbar sein müssen, abhängig vom Code von eine bestimmte Zelle in der Zeile. Wir haben die Umsetzung der html des Gitters als:

<div id="gridSummary" ui-grid="gridOptions" class="grid-summary" ui-grid-auto-resize ui-grid-selection ui-grid-tree-view ui-grid-pinning> 
     <div class="grid-empty" ng-show="!gridOptions.data.length">No Corresponding Data Found</div> 
</div> 

und haben mit dem isRowSelectable gridOption experimentiert, das tut, was wir wollen, mit Ausnahme einer Frage: wir wollen nicht das untaugliche Häkchen-Symbol auf dem nicht wählbar erscheinen Reihen. Gibt es eine Möglichkeit, das Häkchen zu verbergen/zu reduzieren, wenn die Zeile nicht auswählbar ist?

Dank

Answer 1

Sie können dies erreichen, indem die rowHeaderIcon für nicht wählbare Zeilen zu ändern.

Sie können die Vorlage für die Kopfzeile der Auswahlzeile überschreiben und benutzerdefinierte CSS hinzufügen. Inject templateCache in Ihrem Controller und überschreiben Sie die Vorlage wie folgt.

Die Vorlage verwendet eine Methode in Ihrem Controller-Bereich, um festzustellen, ob die Zeile auswählbar ist.

Gefunden diese nützliche plunker.

Answer 2

I'd like to propose this Plunker which has no icon at all for unselectable rows

$templateCache.put('ui-grid/selectionRowHeaderButtons', 
    "<div ng-class=\"{'ui-grid-selection-row-header-buttons': grid.appScope.isSelectable(row), 'ui-grid-icon-ok' : grid.appScope.isSelectable(row), 'ui-grid-row-selected': row.isSelected}\" ng-click=\"selectButtonClick(row, $event)\">&nbsp;</div>" 
);