Css 角度网格2网格大小

我目前正在研究angular-gridster2的集成。目标是获得一个具有固定行高、固定列数和应计算大小的网格。这是我当前的GridsterConfig：

{
  setGridSize: true,
  margin: 5,
  displayGrid: DisplayGrid.OnDragAndResize,
  gridType: GridType.VerticalFixed,
  keepFixedHeightInMobile: true,
  fixedRowHeight: 50,
  minCols: 6,
  maxCols: 6,
  swap: true,
  pushItems: true,
  resizable: { enabled: true },
  draggable: {enabled: true },
  enableEmptyCellDrop: true,
}

---

使用此配置，网格高度按预期计算（完美）。问题是在调整窗口大小后宽度保持不变。当我将setGridSize属性设置为false时，宽度计算按预期工作，但高度始终是边距的2倍。

我现在的解决方案是，我创建了一个父容器div，在其中根据网格行设置高度（使用行*（fixedRowHeight+边距）计算高度）.

您只需使用gridster内置选项，如：

vm.options = 
{
    minCols: 7,
    maxCols: 7,
    minRows: 4,
    maxRows: 4,
    maxItemCols: 50,
    minItemCols: 1,
    maxItemRows: 50,
    minItemRows: 1,
    maxItemArea: 2500,
    minItemArea: 1,
    defaultItemCols: 1,
    defaultItemRows: 1,
    setGridSize: true,
    fixedColWidth: 250,
    fixedRowHeight: 250,
};

供参考：

---

我使用了以下配置，它对我有效：

    itemChangeCallback: ((item: GridsterItem) => {
         // Your content here
      }),
      itemInitCallback: ((item: GridsterItem, itemComponent: GridsterItemComponentInterface) => {
         // Your content here
      }),
      setGridSize: true,
      gridType: 'verticalFixed',
      fixedRowHeight: 237,
      minRows: 2,
      maxRows: 100,
      minItemRows: 2,
      maxItemRows: 2,
      defaultItemRows: 1,
      minCols: 12,
      maxCols: 12,
      maxItemCols: 12,
      minItemCols: 1,
      defaultItemCols: 1,
      maxItemArea: 2500,
      minItemArea: 1,
      swap: true,
      displayGrid: 'onDrag&Resize',
      compactType: 'compactUp', // 'compactUp&Left',compactLeft&Up'
      pushItems: true,
      resizable: { enabled: true },
      draggable: {
        enabled: true
      }

---

希望这会有所帮助

谢谢！对于我们的修复，我们需要gridType:“修复”