Check this out:
http://plnkr.co/edit/m1mIxoGMeLlGkaiyFtSN?p=preview
All I did is in your folderSelect function I added an else condition:
if ( node.expanded ){
//append
} else {
angular.element($event.target).parent().find('treechild').css({display:
'none'})
}
This is the expected behavior you'd like to see, correct?
However, note this solution is far from optimal:
1. With each click on the 'One' or 'Two' when they are collapsed, you're
making a request to get the data from the server. This should be done only
in the first click
2. In addition, with each click you're appending a dom element, which then
gets hidden, ie. the user clicks and a <treechild> element gets appended
and then hidden and so on.
Hope this helps
On Monday, February 3, 2014 5:28:31 PM UTC-5, Randy Paries wrote:
>
> I am creating a tree view and trying to stick to angular. I have it close,
> where when the user clicks on a folder , i append a new directive which in
> turn via ajax gets the data to display.
>
> The problem i am having is how to hide the dynamically created directive.
> When the user initially clicks on the folder, *folderSelect* is called
> and i insert a treechild directive. When the user clicks on the same
> *folderSelect* i need to hide the new treechild just created. I would
> think i can do it using *ng-show* on the directive i am creating. Just
> struggling wrapping my head around how to do it when creating this
> directive dynamically. Thanks in advance for any help
>
>
> I have included a quick sample.when you click on the line item i opens and
> shows the children. What i am trying to do, is when they click on the LI
> again and it is open i hide the children
>
> http://plnkr.co/edit/Qq9BIyDy2Cq29iprIAzg
>
> Thanks for any help
>
>
>
>
--
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/groups/opt_out.