问题标签 [angular-gridster2]

我刚开始做一个项目，可定制的仪表板是它的主要功能。仪表板由可拖动和可调整大小的框组成。

现在，当我们决定也支持 IE11 时，结果发现 IE11 上的拖动功能性能极差，这是我们正在使用的库的内部问题。

https://github.com/tiberiuzuld/angular-gridster2

关于这个库：

• 关于堆栈溢出的总共 20 个问题。
• 494 颗 github 星
• 一位活跃的贡献者
• 7k npmjs 每周下载量不是很多
• 16 天前我在这个库的 Github 页面上打开了一个问题，并且有 0 个活动或评论。
• 我们使用 Angular 框架，每次 Angular 版本升级时，这个库版本都得升级，一旦这个库不再支持，就会出现问题

问题是 - 什么是正确的做法：

• 从头开始实施我们自己的解决方案
• 继续将这种库用于关键应用程序功能，并准备好在需要时分叉代码

在我的仪表板上执行一些调整大小/拖动操作后，我想将更改后的小部件的更新大小和位置保存在我的 MongoDB 数据库中。幸运的是，gridster 库可以对可拖动和调整大小的事件做出反应。但不幸的是它们是静态的，所以当我想通过使用我的数据库服务来保存新值时，它不起作用，因为它不能使用它，因为它不是静态的。

我使用了 Angular 6 和 angular-gridster2 6.0.10。

有谁知道如何使用调整大小/拖动事件来保存我的数据？

这是代码（不可运行，因为我减少了很多）：

我收到此错误：

我使用 angular-gridster2 为我的 Angular 应用程序实现小部件。

代码是这样的：

和 grid.ts

效果很好，但是我想意识到，子组件将值传递给父组件，或者父组件监听子组件的变化。

例如，我有另一个名为 helloWorld 的组件

你好世界.ts

我尝试过使用 ViewChild 方法，但它不起作用。我的目标是，如果父级知道或听到子组件中的按钮被单击，则将创建新的小部件。

任何解决方案？

有人可以告诉我更多吗？

此致，

狮子座

我已经使用 Gridster 2 在我的 Angular 应用程序中创建了 Widget。但是我现在有一个问题，在一个小部件中有一个文本区域输入字段，但是这个输入字段不能编辑，因为整个小部件是可拖动的。

我尝试使用 z-index，但它不起作用。

代码如下：

如何设置我的小部件，以便我可以编辑此输入字段。

此致，

狮子座

使用 Angular 7 和 Gridster2。

我有一个包含多个小部件的仪表板。每个小部件都是 gridster 项目中的单独角度组件。当我单击另一个小部件时，我必须更新小部件数据。我的问题是模型已成功更新，但未自动显示数据，单击 gridSter 项目中的任意位置后会显示更改的数据。

当我不使用 GridSter 时，这工作正常。

任何形式的帮助都将受到高度赞赏。

当我切换侧导航时，我等待响应，然后调用gridster.resize()：

这是一个完整的堆栈闪电战示例。

确保应用程序窗口足够宽，以便 gridster 显示桌面布局- 或更好地在新窗口中打开应用程序。

这是一个示例：
当我启动应用程序时，我的 gridster 项目磁贴的宽度约为 223，并且按预期显示。

当我现在切换 side-nav时，gridster 项目的大小已正确调整：

• 当我使用开发工具时，我可以看到瓷砖的新宽度是 252
• gridster 调整大小回调的控制台日志也显示宽度为 252
• 但是组件中的宽度是错误的：它仍然是 223（参见图块中的文本）：

当我再次切换侧导航以将其打开时，也会发生同样的情况：

• 瓷砖正确回到 223
• 但磁贴中的文字仍显示 252 的宽度
• 似乎我的瓷砖的宽度总是落后

你知道我错过了什么吗？

注意：在我的实际应用程序中，磁贴包含一个图表组件，该组件将根据其父 div（在磁贴中）自动调整大小。所以重要的是，当调整大小事件发生时，平铺中的 dom-width/height 是正确的。

笔记：

• 这也发生在 Angular、angular-gridster2 和 angular-material 的最新 8.x 版本中：stackblitz 示例

我在我的 angular 6 应用程序中使用 angular-gridster2。每当我拖动网格时，它都会超出容器。我想限制网格移出我的容器。

我试过给gridType：'fit'。但它不工作。

我正在使用矩形卡片创建板，并且正在使用 angular-gridster2 库。我正在使用 VerticalFixed 网格类型并默认它具有三个列。是否可以设置断点并为某些浏览器宽度设置两列？

我已向 Gridster2 小部件添加了一个组件。当我使小部件的高度变短时，组件容器不考虑小部件的大小，即当小部件减小时组件容器的大小不会减小。

我不确定某些 Gridster2 小部件样式是否覆盖了我的组件样式。

这是 Stackblitz 上的应用程序：https ://stackblitz.com/edit/angular-gridster12345

我在 stackblitz 应用程序中以红色突出显示了组件容器。容器类是“notification-widget__container”（见下文）

我有以下网格=>

当用户单击一个按钮时，我想添加一个新元素（并调整每个其他元素的大小，以便显示我的元素：

基本上，当前占用我想要放置新元素的空间的所有元素都将被调整大小。

有没有办法从包中做到这一点？或者我必须做一个自定义功能？

现在代码把这个扔给我

angular-gridster2.js:1649 无法放置在仪表板的边界内，试图自动定位！/n{"cols":4,"rows":5,"x":1,"y":0 } angular-gridster2.js:1804 不能放在仪表板的边界内！/n{"cols":4,"rows":5,"x":1,"y":0}