问题标签 [gridstack]

我遇到了这个问题。

当我更改小部件的位置时，例如拖动两个小部件。使用事件“更改”来获取这些更新的小部件。我确实检查了改变的位置。

if (stack_item.data('gs-x') != items[i].x || stack_item.data('gs-y') != items[i].y) {

我重新加载页面。改变小部件的位置，没有任何反应。然后再次更改同一小部件​​的位置并保存。

为什么？如何保存坐标，实际上改变了？

我正在尝试在我的 Angular 项目中实现第三方 .js 库（gridstack.js）。但是我对如何使用/导入类型文件（.d.ts）感到困惑。

所以到目前为止我的方法是通过 npm 安装 gridstack 以及它的类型。然后我尝试将它导入到我的 component.ts 中。( import * as gridstack from 'gridstack')，但 index.d.ts 未被识别为模块。我想这是有道理的，因为 index.d.ts 文件中没有导出语句，但也许我错了？

所以我的问题是，如何在 DOM 和 component.ts 中访问 gridstack？也许有人可以澄清一下，如果每次输入的设置都相同，或者它是否取决于您尝试使用的库。我觉得我已经看到了五十种不同的方法来做到这一点，而且每次我都变得更加困惑。

我试图弄清楚如何在我的 Angular 项目中使用类型文件。但是所有指南或 SO 帖子似乎都告诉只在类型文件中导入声明的模块。在我的例子中（gridstack.js），它没有声明的模块，只有接口和一个声明的命名空间。

我已经在类型下的 tsconfig.file 中声明了 gridstack。我可以例如声明一个IGridstackOptions没有编译器错误的类型变量，但我得到一个运行时错误告诉我 C:/myPath/src/app/other-route/other-route.component.ts (16,60): Cannot find name 'IGridstackOptions'.

有人知道我做错了什么吗？拥有一个没有声明模块的类型文件是否有意义？如果是，你能解释一下这背后的原因吗？

谢谢 ：）

我正在使用gridstack.js并且需要在调整大小时保持纵横比。我尝试了很多在谷歌上找到的方法，但没有任何效果。以下是我为演示该问题而制作的 JSFiddle 的链接： jsFiddle

我有一个包含随机数量的项目的容器，我使用Gridstack.js它来根据每个项目的行/列大小自动排列它们。

我当前的场景是一个包含 4 个项目的 3 列页面，所以我在第一列中有一个项目，在第二列中有 2 个，在第三列中有最后一个。

发生的情况是 2 个堆叠的项目最终位于不同的列上，而第四个项目堆叠在中间的一个。似乎插件正在填充网格，优先考虑列，因此每个新项目将被放置在第一个空列中，然后再转到下一行。

这是一个小提琴（无法使用片段）来澄清问题： https ://jsfiddle.net/c57ter62/1/

基本上，预期的结果应该有 3 和 4 交换。

有谁知道如何达到这个结果？

我知道这可能是一个常见问题，但我没有找到答案。

我需要为包含未知数量的可变大小元素的网格构建一个 3 列响应式布局。它们的大小在网格中被限制为最大 3x3。

我的问题是我需要能够堆叠 1 行项目，但是我尝试的每个插件最终都会在列之前填充我的行。

例如，这是一个使用gridstack.js的解决方案：

正如您在图像中看到的，绿色元素没有按应有的方式堆叠。

要将它们堆叠起来，我需要交换 div 3 和 4，从而实现这一点（这是预期的布局）。

不幸的是，这些项目是从外部服务接收的，所以我无法控制它们的顺序（这毫无意义，因为我不知道预期的布局是什么）。

我对Isotope的模式有点运气，这意味着它修复了图片中的示例，但是添加第五个元素会创建第四列，我被迫只有其中的 3 个，所以我不能真正使用它.fitColumn

这是我需要实现的测试布局的 HTML（这是我被要求做的一个示例）：

是否有人对允许我构建这样的布局的 javascript 解决方案有任何想法（也需要支持单列模式！）？我的选项不多了，我想避免为此任务编写自定义解决方案，因为我对 javascript 没有那么丰富的经验。

是否需要任何选项以便嵌套网格内的图标可以点击？

我在父网格上有一个图标，它工作正常，但是当涉及到嵌套网格内的图标时，什么也没有发生。

我正在尝试使用角度 gridstack 框架。我正在尝试使演示代码正常工作。

这是框架的链接：

https://github.com/kdietrich/gridstack-angular

这是我的角度文件：

}]);

这是我的 index.html 文件：

这些库工作正常，但问题是我无法移动或调整小部件的大小。这是框架中的错误吗？我可以做些什么来移动一个小部件并调整它的大小？

亲切的问候

现场演示： http: //kdietrich.github.io/gridstack-angular/demo/

现场演示代码：https ://github.com/kdietrich/gridstack-angular/tree/master/demo

图书馆清单：

我将 Angular2 (2.3.1) 和 gridstack.js (gridstack.js 0.3.0) 与 jquery 1.11.1 一起使用。尝试按照这个例子

https://stackoverflow.com/questions/39901473/wrap-gridstack-js-into-angular-2-component

让 gridstack.js 与 Angular 2 一起工作并出现以下错误：

zone.js:170 Uncaught TypeError: $(...).gridstack 不是 HTMLDocument 中的函数。( http://localhost:8080/:111:26 ) 在 mightThrow (eval 在 webpackJsonp.87.module.exports ( http://localhost:8080/scripts.bundle.js:88:9 ), :3583:29 ) 在 ZoneDelegate.invokeTask ( http://localhost:8080 的 webpackJsonp.87.module.exports ( http ://localhost:8080/scripts.bundle.js:88:9 ), :3651:12 /polyfills.bundle.js:16599:31 ) 在 Zone.runTask ( http://localhost:8080/polyfills.bundle.js:16398:47 ) 在 ZoneTask.invoke ( http://localhost:8080/polyfills.bundle .js:16652:38 ) 在 data.args.(匿名函数) (http://localhost:8080/polyfills.bundle.js:17813:29 )

不知道如何解决这个问题。任何帮助，将不胜感激。

谢谢。

我想要嵌套的gridster（gridster indside gridster）。就像Nested Gridstack

为此，我通过阅读一些在线内容编写了我的 Gridster 代码。但我没有得到预期的结果。

HTML 代码

JS代码

我尝试了很多，但完全不知道如何进行此操作。任何形式的帮助都会非常好