有一些按钮,一个无用的标题和网格。第一次渲染组件时,一切都很好。当我按下另一个按钮时,我进行API调用以更新数据,并且过滤器随机显示(Tutto)
。 (Tutto是意大利语单词,意思是“一切”)。事实是,我还没有写任何有关更改任何类型的过滤的内容。
这是表格html代码:
<dx-data-grid
id="grid"
[dataSource]="dataSource"
[showColumnLines]="true"
[showRowLines]="true"
[showBorders]="true"
[remoteOperations]="true"
[rowAlternationEnabled]="true"
[allowColumnResizing] = "true"
[columnResizingMode] = "'widget'"
[columnAutoWidth] = "false"
(onCellClick)='cellClick($event)'
[columns]="gridColumns"
(onToolbarPreparing)="onToolbarPreparing($event)"
(onExporting)="onExporting($event)"
(onExported)="onExported($event)"
>
<!-- <dxo-header-filter [allowSearch]="true" [visible]="true"></dxo-header-filter> -->
<div *dxTemplate="let data of 'zoomInMap'">
<span class="p3-001-map-crosshair-a zoomLink-PUC" *ngIf="data.value"></span>
</div>
<div *dxTemplate="let data of 'openFile'">
<div *ngIf="data.value!='' && data.value!=null">
<a style='cursor:pointer;text-decoration:underline;color:rgba(5, 60, 222, 0.98)'>Apri</a>
</div>
</div>
<dxo-column-chooser
[allowSearch]="true"
[enabled]="true"
[mode]="'select'"
height="390">
</dxo-column-chooser>
<dxo-remote-operations
sorting="true"
paging="true"
filtering="true">
</dxo-remote-operations>
<dxo-scrolling mode="virtual" rowRenderingMode="virtual" ></dxo-scrolling>
<dxo-filter-row
visible="true"
applyFilter="auto">
</dxo-filter-row>
<dxo-search-panel
visible="minimized"
width="240"
placeholder="{{lang.phrase('search...')}}">
</dxo-search-panel>
<dxo-load-panel enabled="true"></dxo-load-panel>
<dxo-export [enabled]="true" fileName="Export" [allowExportSelectedData]="false"></dxo-export>
</dx-data-grid>
这是更新网格内数据的代码:
this.dataSource.store = new CustomStore({
load: function (loadOptions) {
if(loadOptions['dataField']=="file_desc") {
var params="?classname=" + me.aClassID + "&key=_undefined&filter=&sort=&skip=0&take=15";
// add authorization header with jwt token
let headers = new Headers({ 'Authorization': 'Bearer ' + authenticationService.token });
let options = new RequestOptions({ headers: headers });
return http.get(valueListUrl + params, options)
.toPromise()
.then(response => {
var json = response.json();
return {
data: json.data,
totalCount: json.totalCount
};
}).catch(() => { throw 'Errore caricamento dati' });
}
});
当我按下按钮时,上面的代码将以这种方式调用:
this.dataGrid.instance.refresh()
.then( () => {
this.dataGrid.instance.clearFilter();
});
有人发现吗?任何帮助表示赞赏。