AngularJS + Gridster

[mariorbarbbosa]

I'm implementinga dashboard in Angularjs (w/ custom directives) based on Gridster. I'm using this base code: http://stackoverflow.com/questions/14394924/gridster-jquery-plugin-on-angularjs-ng-repeat-content-going-bad.

The problem is when I change $scope.items after removing a widget. Gridster loses track of widgets and it turns a mess.

Anyone with the same issue?

[artem-karpenko]

We've integrated gridster with AngularJS in different way - by manipulating widgets only via gridster API, not messing with DOM by ourselves. There is a directive that creates gridster object with an empty

. And then we use events for adding/removing widgets via add_widget/remove_widget calls from directive.

[mariorbarbbosa]

@artem-karpenko the problem is that I want to bind both ways.

So when I remove a widget using remove_widget (gridster api) my controller is notified and deletes the widget from my $scope.items.

When I change (only delete) an item from that collection occurs the problem and gridster can't resolve.

[chaosotic]

Let gridster do the work using the provided API. You can use the provided callbacks as well to update your models in Angular. I've tried letting angular compile widgets using ng-repeat and such but it does not work well at all.

[JobaDiniz]

Here's a angular version that looks promising: http://manifestwebdesign.github.io/angular-gridster/

This is not a wrapper on the original gridster jQuery plugin (http://gridster.net/). It is instead completely rewritten as Angular directives