Angular-Slickgrid显示空白记录

时间:2019-01-14 08:35:25

标签: angular slickgrid

我正在尝试使用angular slickgrid在应用程序中显示网格选项。我已引用wiki page来显示网格,但是网格中没有显示数据,甚至在浏览器控制台中也没有错误。

我已经根据post更新了我的app.module Angular.json,但没有使用和显示0条记录的网格。我尝试使用stackblitz来创建此问题,但不允许我安装angular-slickgrid软件包,因此无法发布实时示例。

我的代码

import { Component, OnInit } from '@angular/core';
import { Column, FieldType, Formatter, Formatters, GridOption }  from 'angular-slickgrid';

export class ReportComponent implements OnInit {
  columnDefinitions: Column[];
  gridOptions: GridOption;
  dataset: any[];

  ngOnInit(): void  
  {        
    this.gridOptions = {
      autoResize: {
        containerId: 'demo-container',
        sidePadding: 15
      },
      enableAutoResize: false,
      enableExcelCopyBuffer: true,

    };

    this.columnDefinitions = [
      { id: 'title', name: 'Title', field: 'title', sortable: true, type: FieldType.string, width: 70 }              
    ];

    this.dataset = [];
    for (let i = 0; i < 1000; i++) {    
      this.dataset[i] = {
        id: i, 
        title: 'Task ' + i
      };

    }

  }

}

我的html

 <angular-slickgrid gridId="grid2" style="width:95%;"
                [columnDefinitions]="columnDefinitions"
                [gridOptions]="gridOptions"
                [dataset]="dataset">
            </angular-slickgrid>

我正在使用的版本: jquery :^ 3.3.1 angular-slickgrid :^ 2.1.5 @ angular / core :^ 7.2.0

1 个答案:

答案 0 :(得分:2)

这是因为您正在使用

enableAutoResize: false,

将其更改为

enableAutoResize : true

它应该起作用,当您使用false时,您需要根据需要手动为网格赋予一个高度(使用CSS)。但是当您允许true时,它将自动设置大小并在浏览器上调整大小。

demo