3

我尝试使用 Angular-gridster2，但我遇到了一个问题 - 当我将第一个元素添加到网格时 - 这个元素占用了网格的所有空间。它在浏览器中的元素中的外观。

<gridster-item _ngcontent-hrw-c99="" ng-reflect-item="[object Object]" class="ng-star-inserted" style="z-index: 1; display: block; transform: translate3d(0px, 0px, 0px); width: 1900px; height: 586px; margin-bottom: 10px; margin-right: 10px;">

一旦我刷新页面 - 网格变得可见，所有列和行都会显示并且它开始正常工作 - 每个元素只需要 1 行和 1 列。

<gridster-item _ngcontent-jdx-c99="" ng-reflect-item="[object Object]" style="z-index: 1; display: block; transform: translate3d(0px, 0px, 0px); width: 200px; height: 200px;">

这是我的网格设置：

this.options = {
  gridType: GridType.Fixed,
  fixedColWidth: 200,
  fixedRowHeight: 200,
  minCols: 5,
  maxCols: 6,
  minRows: 5,
  maxRows: 6,
  draggable: { enabled: true },
  displayGrid: 'always',
  swap: true,
};

同样奇怪的是，在我添加第一个元素之前，网格没有显示（即使 displayGrid: 'always'）。

感觉就像只有在添加第一项并刷新页面后，网格才会“调用”设置。

我尝试按照手册页面上的设置进行操作，但也没有解决问题https://tiberiuzuld.github.io/angular-gridster2/gridSizes。当我将 minCols 和 minRows 放在那里时-它在手册中可以正常工作（但在我的代码中却没有）。对于这种情况，我的设置是：

  minCols: 4,
  maxCols: 5,
  minRows: 4,
  maxRows: 5,
  maxItemCols: 1,
  maxItemRows: 1,

谁能告诉我，拜托，我做错了什么？先感谢您！

4

1 回答 1

2

我想我可以自己解决。如果其他人有同样的问题，我会提供答案。

我忘记了我也有一个切换来在网格的不同状态之间切换（对于我的情况 - 在 this.optiosn.draggable.enabled 的 true 和 false 之间切换）。在我只为一个州提供列和行的数量之前。一旦我为这两个州添加了它 - 问题就解决了！

我在 this.options 中谈论这些行：

minCols：4，maxCols：5，minRows：4，maxRows：5，

于 2021-08-28T12:40:36.307 回答