Every problem ( or atleast most ) can be represented in terms of pure models. Your first task is to figure out how to represent the problem you have in terms of purely models.. ( objects in case of angular ). Then, in angular, part of your view interface should work on manipulating this model structure. dragging and dropping onto some other place should be able to create the new model structure.
Another part is responsible for rendering this model structure. Maybe you can use two ng-repeats ? Maybe its something else. Its upto you. If you can break things down to this structure ( think in terms of models and views ) angular becomes a breeze. On Tue, Jul 15, 2014 at 4:10 PM, Eric Eslinger <[email protected]> wrote: > I've been noodling over a similar kind of case. What I ended up deciding > was that yes, it's totally possible. You'd have to be pretty clever about > it, and you may want to use ui-router. > > One could imagine a typical responsive grid layout like bootstrap3, > foundation, or neat providing the general structure of rows and columns. > Then it's just a matter of organizing the div objects in the right order > and giving them the appropriate values for their scale (width, etc). You > could then define a directive that's in charge of rendering a Thing into > the page (folder, image, video, property), especially if the rendering is > similar across the four or more cases (tab plus border plus inner content). > Each Thing directive would have a template like <div > ng-class="{{view.columnWidthClass}}">stuff</div> > > Then define some kind of object on the $scope that represents the actual > structure, so you can do ng-repeats over that view model and figure out how > to deal with the view.columnWidthClass data getting into the scope as > column-3 or column-6 or whatever, depending on how wide you want the thing > to be. Define drag behaviors to change the underlying data model, and the > page will rearrange itself. > > It's all definitely doable, and I don't think you'd need to use compile > functions either, just linking ones. That said, I've not actually > implemented this yet- I'm just thinking about how it could be done. At the > end of the day, Angular's a pretty rad MV* framework, you can do most > anything with it that you want, provided you're willing to dig deep into > how it works. > > e > > > On Tue, Jul 15, 2014 at 4:46 AM, Robert Retzbach <[email protected]> > wrote: > >> Hi, >> >> I would like to create an angular app in which the page layout is >> dynamically changable by the user: >> I want the user to be able to rearrange viewparts of the page as he >> likes. The app can create new viewparts on-the-fly. So there is no fixed >> number of viewparts. >> >> My current idea is to achieve that via changing of the DOM structure. >> Please take a look at the mockup below: >> <http://i.stack.imgur.com/iAZw9.png> >> >> >> How would I go about building my angular app? >> How can I have a dynamically changing DOM structure yet still use >> angular's databinding for the content of each view? >> >> If this is doable the following usecase could be realized in an ng-app: >> >> Drag a view by its handle: >> <http://i.stack.imgur.com/ffVZh.png> >> >> >> As a result the view now shares space with another view: >> >> >> >> Best regards >> Robert >> >> -- >> You received this message because you are subscribed to the Google Groups >> "AngularJS" group. >> To unsubscribe from this group and stop receiving emails from it, send an >> email to [email protected]. >> To post to this group, send email to [email protected]. >> Visit this group at http://groups.google.com/group/angular. >> For more options, visit https://groups.google.com/d/optout. >> > > -- > You received this message because you are subscribed to the Google Groups > "AngularJS" group. > To unsubscribe from this group and stop receiving emails from it, send an > email to [email protected]. > To post to this group, send email to [email protected]. > Visit this group at http://groups.google.com/group/angular. > For more options, visit https://groups.google.com/d/optout. > -- Regards, Ganaraj P R -- You received this message because you are subscribed to the Google Groups "AngularJS" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To post to this group, send email to [email protected]. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
