I'm trying to expand a DIV element on my angular layout. I'm using
angular-masonry <https://github.com/passy/angular-masonry> to give a
mason-style to my layout, but now I need to expand those boxes on click.
I've tried a lot of stuff, but it kept overlapping my others elements. Soon
I figured out that I'll have to write it the "angular way" so I don't run
into DOM manipulation conflicts.
Here's my code:
<div class="row" masonry>
<div
class="masonry-brick item-component col-sm-4 col-md-4"
ng-repeat="component in components.components | filter :
components.filterByFilter | filter : searchText"
ng-click=" // expand #expandable // "
>
<div class="component-wrapper">
<div class="component">
<img ng-src="@{{ component.thumb }}"/>
</div>
<div class="component">
@{{ component.name_en }}
</div>
</div>
<div id="expandable" class="expand-me codes-wrapper">
<p>XXX</p>
<p>YYY</p>
<p>ZZZ</p>
</div>
</div>
</div>
Here's what I'm trying accomplish using the "angular way":
http://codepen.io/desandro/pen/daKBo
--
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.