Actually you could do this by simply creating a "WidgetSocket" Directive which will transclude it's widget in and just add those placeholders to that using ng-if (which actually removes them from the DOM if they are not used).
There is probably other simple solutions which actually will let you do this in a "declarative" way... Things tend to always end up being more simple with pure Angular, but you need to learn to allot about directives in order to get there, like directives that communicate, transclude and reuse of all the directives that already exists... But IMO it's worth learning, as it will save much time later on... Anyways, that is just my experience. On Sunday, September 7, 2014 8:02:10 PM UTC+2, Kevin W wrote: > > Eric- > > > > I agree with your approach for a drag/drop treeview type solution. > However, this is not that simple. I’m building a layout manager that lets > you drag & drop widgets around the page (add, move, delete, etc.). As you > are dragging, I need to insert a placeholder to shift things around to show > where the drop will occur if you let go now. This includes adding widgets > above/below existing widgets, causing new columns to get created, or new > rows. So to do this ahead of time I’d have to build in a > top/bottom/colright/colleft/rowtop/rowbottom element on every single > widget. That’s a lot of excess HTML rather than just injecting the > placeholder where it needs to be depending on where the current dragover is > occurring. > > > > Thanks for everyone’s input! > > Kevin > > > > *From:* [email protected] <javascript:> [mailto: > [email protected] <javascript:>] *On Behalf Of *Eric Eslinger > *Sent:* Sunday, September 7, 2014 8:49 AM > *To:* [email protected] <javascript:> > *Subject:* Re: [AngularJS] Re: AngularJS way of doing jQuery.before and > jQuery.after > > > > Yeah, I'm not sure where the breakpoint is between easy and hard from the > framework perspective, but in a generic ng-repeat / tree directive kind of > situation, I'd approach D&D by moving attributes around on a model object > (reorder in the array, moving from foo.tubers to foo.vegetables and so on), > and then let angular render the DOM appropriately. > > > > OTOH, that may be over-engineering a simple enough use pattern for jQuery. > > > > e > > > > On Sun, Sep 7, 2014 at 3:33 AM, Jens Melgaard <[email protected] > <javascript:>> wrote: > > You can still do complex drag and drop and much other using Angular, what > you need is a model to describe your structure, and then just let Angular > render that, it's now about making "all possible" permutations in html... > > > > On Saturday, September 6, 2014 4:58:42 AM UTC+2, Kevin W wrote: > > Eric - I realize I can use jQuery. I was just trying to avoid it on > principle (while I'm still learning angularjs). > > > > I know for many things, having content already in the page with ng* > attributes is the way to go. However, I really am doing dynamic work here > based on drag & drop so it wouldn't make sense to have all the possible > permutations baked into the HTML. > > > > I think I have decided, however, that for this complex UI manipulation, > it'll make sense to just stick with jQuery within my directives. > > > > Thanks! > > Kevin > > > > On Friday, September 5, 2014 11:40:30 AM UTC-6, Kevin W wrote: > > The jqlite has append but it doesn't have before and after. > > > > Does anyone know of the appropriate way to perform these actions > (before/after)? > > > > Thanks! > > Kevin > > -- > 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] <javascript:>. > To post to this group, send email to [email protected] <javascript:> > . > 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 a topic in the > Google Groups "AngularJS" group. > To unsubscribe from this topic, visit > https://groups.google.com/d/topic/angular/BK5g2T77frY/unsubscribe. > To unsubscribe from this group and all its topics, send an email to > [email protected] <javascript:>. > To post to this group, send email to [email protected] <javascript:> > . > 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.
