材质按钮datagrid devexpress

时间:2020-07-28 09:25:39

标签: angular button datagrid angular-material devexpress

是否可以在dexpress数据网格的列内定义物料按钮?

<dx-data-grid [dataSource]="datasource" keyExpr="id">
<dxi-column>
        <button mat-button>Basic</button>
    </dxi-column>
</dx-data-grid>

app.module.ts

import { ReactiveFormsModule } from '@angular/forms';
import { DxDataGridModule, DxBulletModule, DxTemplateModule, DxNumberBoxModule, DxPopupModule, DxCheckBoxModule, DxLookupModule, DxButtonModule } from 'devextreme-angular';
import { MatIconModule } from '@angular/material/icon';
import { MatTabsModule } from '@angular/material/tabs';
import { MatButtonModule } from '@angular/material/button';
import { MatChipsModule } from '@angular/material/chips';
import { MatExpansionModule } from '@angular/material/expansion';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatInputModule } from '@angular/material/input';
import { MatPaginatorModule } from '@angular/material/paginator';
import { MatRippleModule } from '@angular/material/core';
import { MatSelectModule } from '@angular/material/select';
import { MatSortModule } from '@angular/material/sort';
import { MatSnackBarModule } from '@angular/material/snack-bar';

以这种方式不显示按钮。

1 个答案:

答案 0 :(得分:1)

创建一个cell template

<dx-data-grid [dataSource]="datasource" keyExpr="id">
    <dxi-column cellTemplate="myCellTemplate"></dxi-column>
    <div *dxTemplate="let data of 'myCellTemplate'">
        <button mat-button>Basic</button>
    </div>
</dx-data-grid>