我正在构建一个定制的 Angular Gridster 仪表板。在加载页面时,我调用了一个函数,该函数从数据库中加载 Gridster 小部件的位置、大小和内容
function getDashboard() {
$scope.dashboard.widgets = [];
angular.forEach($scope.filtered_activities, function(object) {
$scope.dashboard.widgets.push(
{
pk: object.pk,
process: object.process,
row: object.row,
col: object.col,
sizeY: object.sizeY,
sizeX: object.sizeX,
}
)
});
};
这工作正常,小部件就像我在重新加载页面之前离开它们一样,putActivies(widget) 将它们存储在数据库中。
但是,当我想将它们拖到不同的位置时,我只能得到我存储在数据库中的位置,而不是当前位置。
$scope.gridsterOptions = {
margins: [20, 20],
outerMargin: false,
pushing: true,
columns: 6,
rowHeight: 100,
draggable: {
handle: 'h2',
enabled: true,
stop: function(event, $element, widget) {
console.log(widget.col);
putActivities(widget);
}
},
resizable: {
enabled: false,
}
};
所以 console.log(widget.col) 只给我数据库位置,而不是当前位置。 当我从 getDashboard() 中省略 row 和 col 属性时,它可以工作,但当然它们没有正确的位置。
是否有另一种方法来访问 widgets.col(和行)属性)?
我的 html 看起来像这样:
li gridster-item="widget"ng-repeat="widget in dashboard.widgets"
最佳答案
可拖动:{
句柄:'h2',
启用:真,
停止:功能(事件,$元素,小部件){
控制台日志($元素)
putActivities($元素);
}
},
这会完成你的工作。
注意:$element 是一个对象,它有 sixeX, sizeY, col,row 存储当前位置(col,row) 和大小(sizeX,sizeY)
关于angularjs - Angular Gridster 在数据库中的存储位置,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37087781/