首页 > 解决方案 > 将值传递给扩展插件 ng2 智能表

问题描述

我已经检查了分页实现(advanced-example-server.component.ts)的文档和源代码。

并发现它使用的ServerDataSource仅通过HTTP GET 实现分页(_sort、_limit、_page 等参数暴露在 URL 中).....因为我当前的项目工作需要使用 POST 将前端参数发送回- 结束 Restful API,

使用extends to HTTP post调用实现,我不知道如何在分页请求中添加额外的参数。我需要将 request_server 传递给 extendsplugin.ts

import { Observable } from 'rxjs/internal/Observable';
import { ServerDataSource } from 'ng2-smart-table';

    export class PostServerDataSource extends ServerDataSource {

        protected requestElements(): Observable<any> {
            let httpParams = this.createRequesParams();
            return this.http.post(this.conf.endPoint, request_server, { observe: 'response' });
        }

    }

另一个组件.ts

swiftListTable() {

        const request_server = { "userType": this.currentUser.role, "authName": this.currentUser.username }
        this.source = new PostServerDataSource(this.http,{endPoint: this.service.apiURL + 'swift/pagination', dataKey: 'content', pagerLimitKey:"_limit",
        pagerPageKey:"_page",
        sortDirKey: "pageable",
        sortFieldKey: "pageable",
        totalKey:'totalElements'});
      }

标签: javascriptangulartypescriptng2-smart-table

解决方案


有两种方法可以处理它,一种方法是将参数附加到查询字符串中并附加到 url 之类的,

this.service.apiURL + 'swift/pagination?param1=p&param2=q'

其他方法可以在 requestElements 和 swiftListTable 函数中处理它,如下所示。

swiftListTable() {

        const request_server = { 
           "userType": this.currentUser.role, 
           "authName": this.currentUser.username 
        }

       this.source = new PostServerDataSource(http, 
          { endPoint: url, dataKey: 'content', pagerLimitKey:'_limit'}, request_server);

export class PostServerDataSource extends ServerDataSource {

    params: any;

    constructor(http: HttpClient, config: any, params?: any) {
        super(http, config);
        this.params = params;
    }

    protected requestElements(): Observable<any> {
        let httpParams = this.createRequesParams();
        if (this.params) {
          let keys = Object.keys(this.params);
          keys.forEach((key) => {
              httpParams = httpParams.set(key, this.params[key]);
          });
        }
        return this.http.post(this.conf.endPoint, httpParams, { observe: 'response' });
    }

}

推荐阅读