【问题标题】:Type 'Person[]' is not assignable to type 'ColumnSettings[] in Angular 7 Datatable类型'Person []'不可分配给Angular 7 Datatable中的类型'ColumnSettings []
【发布时间】:2019-10-08 17:46:29
【问题描述】:

问题

类型“Person[]”不可分配给类型“ColumnSettings[]”。

“Person”类型与“ColumnSettings”类型没有共同的属性。ts(2322)

预期的类型来自属性“columns”,它在“设置”类型上声明

我已关注http://l-lin.github.io/angular-datatables/#/basic/server-side-angular-way

附加 json 数据表后出现问题。

人物类

export class Person {
id: number;
first_name: string;
last_name: string;
}

角度代码

publicDeals: Person[] = [];

ngOnInit(): void {
const that = this;
 


this.abc();



console.log(this.publicDeals);

this.dtOptions = {
  pagingType: 'full_numbers',
  pageLength: 2,
  serverSide: true,
  processing: true,
  ajax: (dataTablesParameters: any, callback) => {
    that.httpClient
      .post<DataTablesResponse>(
        this.api_url,
        dataTablesParameters, {}
      ).subscribe(resp => {
        that.persons = resp.data;
        //console.log(resp);
        callback({
          recordsTotal: resp.recordsTotal,
          recordsFiltered: resp.recordsFiltered,
          data: [],

        });
      });
     },
  
   columns: that.publicDeals,


};


 }


   abc() {

return this.service.apifunc()
.subscribe(persons => {
  this.testts = TABLE_FIELDS;
   
  
   TABLE_FIELDS.forEach(element => {
    this.publicDeals.push(element);
   });
    this.dtTrigger.next();
});

}

Json 数据

     TABLE_FIELD: [
        {
        data: "id"
        },
        {
        data: "first_name"
        },
        {
        data: "last_name"
        }

        ]
  • 无法将 json 附加到数据表中的列中。

  • 欢迎任何帮助。

【问题讨论】:

  • 你能把这个问题复制到stackblitz.com
  • 问题已解决
  • @afeef 如果问题已解决,请单击解决您问题的答案旁边的“打勾”,而不是添加评论。谢谢
  • 我自己解决了问题并添加了解决方案
  • 也不要在问题中添加答案。如果你想自己回答,add an answer

标签: angular angular7 angular-datatables angular-data


【解决方案1】:

this.dtOptions.columnstypeColumnSettings[] 参考https://github.com/DefinitelyTyped/DefinitelyTyped/blob/e01d6e7abb2343c6b845d4945a368ed55cbf5bd2/types/datatables.net/index.d.ts#L1309

但是你传递了一个Person[],所以打字稿编译器会抛出一个错误。

您必须在分配给this.dtOptions.columns 之前修改数据。

【讨论】:

    【解决方案2】:

    有效的解决方案

    this.abc();
    
    this.p_col = this.publicDeals;
    
    this.dtOptions = {
      pagingType: 'full_numbers',
      pageLength: 2,
      serverSide: true,
      processing: true,
      ajax: (dataTablesParameters: any, callback) => {
        that.httpClient
          .post<DataTablesResponse>(
            this.api_url,
            dataTablesParameters, {}
          ).subscribe(resp => {
            that.persons = resp.data;
    
            callback({
              recordsTotal: resp.recordsTotal,
              recordsFiltered: resp.recordsFiltered,
              data: [],
    
            });
          });
      },
    
      columns: this.p_col,
    
    
    };
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2021-05-21
      • 2020-04-02
      • 2020-05-30
      • 2021-04-16
      • 1970-01-01
      • 2023-01-12
      • 1970-01-01
      相关资源
      最近更新 更多