Javascript Ui网格标题-在最后一个标题列中添加图标
我原以为很简单的事情,结果却不是。。或者至少,我做错了什么,我不知道是什么 让我解释一下我想做什么: 如果我有我的网格,我希望在网格的右上角有一个“plus/add”图标。所以我想,我编辑了Javascript Ui网格标题-在最后一个标题列中添加图标,javascript,angularjs,angular-ui-grid,Javascript,Angularjs,Angular Ui Grid,我原以为很简单的事情,结果却不是。。或者至少,我做错了什么,我不知道是什么 让我解释一下我想做什么: 如果我有我的网格,我希望在网格的右上角有一个“plus/add”图标。所以我想,我编辑了headerTemplate,这就是我被卡住的地方。这就是我现在如何拥有我的headerTemplate: <div role="rowgroup" class="ui-grid-header"> <!-- theader --> <div class="ui-grid-top-
headerTemplate
,这就是我被卡住的地方。这就是我现在如何拥有我的headerTemplate:
<div role="rowgroup" class="ui-grid-header"> <!-- theader -->
<div class="ui-grid-top-panel">
<div class="ui-grid-header-viewport">
<div class="ui-grid-header-canvas">
<div class="ui-grid-header-cell-wrapper" ng-style="colContainer.headerCellWrapperStyle()">
<div role="row" class="ui-grid-header-cell-row">
<div class="ui-grid-header-cell ui-grid-clearfix" ng-repeat="col in colContainer.renderedColumns track by col.uid" ui-grid-header-cell col="col" render-index="$index">
</div>
<div class="ui-grid-header-cell ui-grid-clearfix">Icon</div>
</div>
</div>
</div>
</div>
</div>
偶像
这“添加”了div,但它不适合网格,它只是将其放置在外部。。我如何添加一个列,该列被识别为列,其中只有图标
我知道我可以用gridOptions来实现这一点,只需添加另一个没有数据的字段,但我希望这个应用程序是广泛的,所以我真的希望这个作为一个模板。老实说,模板化的方式让我很困惑。。任何帮助都将不胜感激
如果我不清楚,请让我知道,我会尽力澄清。我找到了一个解决方法:
<div role="rowgroup" class="ui-grid-header"> <!-- theader -->
<div class="ui-grid-top-panel">
<div class="ui-grid-header-viewport">
<div class="ui-grid-header-canvas">
<div class="ui-grid-header-cell-wrapper" ng-style="colContainer.headerCellWrapperStyle()">
<div role="row" class="ui-grid-header-cell-row">
<div class="ui-grid-header-cell ui-grid-clearfix"
ng-repeat="col in colContainer.renderedColumns track by col.uid" ui-grid-header-cell
col="col" render-index="$index">
</div>
<div role="button"
class="ui-grid-column-menu-button"
ng-click="addRecord()"
ng-class="{'ui-grid-column-menu-button-last-col': isLastCol}"
ui-grid-one-bind-aria-label="i18n.headerCell.aria.columnMenuButtonLabel"
aria-haspopup="true">
<span class="material-icons" style="padding: 5px; cursor:pointer;">add</span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
添加
我使用ui网格列菜单按钮class来显示我自己的图标。这就像一个符咒,不幸的是你使用了网格菜单的功能。我在别的地方有我的菜单,所以这对我来说是可行的
这是最终结果:
为什么不使用标题单元格模板?因为我不喜欢在最后一列的所有控制器中设置该模板,所以我在应用程序的多个位置使用相同的网格。如果我想得太多,请纠正我。