Question

我是Angle gridster2的新手。我想知道一个重要的代码，“如何在单击按钮时动态地和静态地加载gridster”。例如，我的UI页面中有一个名为“选择布局”的按钮，当我选择“ 4×1”选项时，网格应根据所选选项动态加载。请帮我解决一下这个。如何使用角度2做到这一点？

Answer 1

您可以使用ndc-dynamic包，这是我的实现方式

HTML

<gridster id="dashboard" #dashboard [options]="options" (drop)="onDrop($event)" class="transparent">
   <gridster-item #gridsterItem[item]="item" *ngFor="let item of dashboardArray">
    <ndc-dynamic class="no-drag" [ndcDynamicComponent]="item.component" [ndcDynamicInputs]="item.input"
                    ></ndc-dynamic>
            </gridster-item>
</gridster>

TS

onDrop事件

this.dashboardArray.push({
                    rows: 4,
                    cols: 4,
                    x: 0,
                    y: 0,
                    componentType: DashboardComponentType.Grid,
                    input: {
                        chartId: '',
                        dashboardId: this.dashboardId,
                    },
                    component: GridChartComponent,
                    name: "GridChart"
})

如何在单击按钮时动态/静态地加载gridster？

1 个答案: