javascript - 将值传递给扩展插件 ng2 智能表

标签 javascript angular typescript ng2-smart-table

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

并且发现它使用的 ServerDataSource 仅通过 HTTP GET(_sort、_limit、_page 等参数在 URL 中公开)实现了分页...... 作为我当前的项目需要使用 POST 将前端参数发送到后端 Restful API,

使用 extends to HTTP post call 实现,我不知道如何在分页请求中添加额外的参数。我需要将 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'});
      }

最佳答案

有两种方法可以处理它, 一种方法是在查询字符串中附加参数并附加到 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' });
    }

}

关于javascript - 将值传递给扩展插件 ng2 智能表,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59047348/

相关文章:

typescript - Mocha & Typescript 和递归加载

javascript - 使用 Javascript 函数更改 onclick 操作

javascript - 点击为div添加边框

typescript - 如何在 Vuex 模块中使用 RxJS

angular - 如何知道在 Angular 4 项目上运行的 typescript 版本

javascript - Angular 5 - 如何将变更检测仅限于组件范围?

javascript - 更改 iframe 的内容

javascript - 有没有工具可以确定我的 jQuery 是否可以跨浏览器运行?

javascript - Angular 2 错误处理 - 发送到订阅的组件

angular - PrimeNG 使用异步管道延迟加载数据