微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

在 gridstack.jsAngular 2+中重置会在下次调整大小或拖动时保留 HTML 属性的旧值,导致问题

如何解决在 gridstack.jsAngular 2+中重置会在下次调整大小或拖动时保留 HTML 属性的旧值,导致问题

我的 angular 7 应用程序使用 gridstack.js v^4.2.5。我可以通过

生成网格

在 GridstackDemoComponent.ts 中

grid: GridStack;
ngOnInit() {
        this.grid = GridStack.init();
}

并在

    <div class="grid-stack">
      <div
        class="grid-stack-item"
        gs-id="grid-1"
        id="grid-1"
      >
      SOME DATA HERE/CHART COMPONENTS
      </div>
    </div>

我有 6 个这样的网格项目,用于 6 个不同的图表。这非常有效。 现在在调整大小或拖动其他地方后重置网格我正在使用以下功能

  resetChartConfig() {
    document.getElementById("grid-1").setAttribute("gs-min-w","4");
    document.getElementById("grid-1").setAttribute("gs-min-h","2");
    document.getElementById("grid-1").setAttribute("gs-x","0");
    document.getElementById("grid-1").setAttribute("gs-y","3");
    document.getElementById("grid-1").setAttribute("gs-w","8");
    document.getElementById("grid-1").setAttribute("gs-h","3");
    ...
  }

此重置功能按预期工作,但在此之后,当我尝试调整大小或拖动任何网格项时,它会自动占用在重置认值之前设置的旧属性值。

例如。 说

  1. 第 1 步:grid-1 (item1) 我调整为 gs-w = 12 ,gs-h = 6 并拖动 位置到 gs-x = 3,gs-y = 3
  2. 第 2 步:点击重置按钮 重置为认值。
  3. 第 3 步:尝试调整或拖动 grid-2 (item2)。

此时 grid-1 将自动采用步骤 1 中的值。

我无法清除旧的 HTML 属性以某种方式保留在 DOM 中。

有什么办法可以实现这个功能吗?

提前感谢您的帮助。

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。