CODEWITHSUNDEEP
angularjs
user1679941
user1679941

Reputation:

Is there a way that I can do an ng-repeat and not have it included in a <div>?

I have coded this:

.row {
  display: table-row;
}
.table {
  display: table;
}    

               <div class="table">
                    <div class="row">
                        <div class="cell">x</div>
                        <div class="cell">x</div>
                    </div>
                    <div data-ng-repeat="x in modal.xx">
                        <div class="row">
                            <div class="cell">y:</div>
                            <div class="cell">y</div>
                        </div>
                        <div class="row">
                            <div class="cell">z</div>
                            <div class="cell">z</div>
                        </div>
                    </div>
           </div>

However the that does the ng-repeat causes problems when it's used inside a display: table-row.

What I really need to do is to have something that will do the repeat and have only the things I want repeating show up. In this case the with ng-repeat in it appears in the dom. I did think of using something like a and putting the ng-repeat in that but I am not sure this is syntactically correct when I'm inside a that's a type of display: table.

Is there a way to do this with angular?

Upvotes: 0

Views: 48

Answers (1)

Joe White
Joe White

Reputation: 97768

Sure. Assuming you're using Angular 1.2 or later, see ng-repeat-start and ng-repeat-end.

So this:

<div data-ng-repeat="x in modal.xx">
    <div class="row">
        <div class="cell">y:</div>
        <div class="cell">y</div>
    </div>
    <div class="row">
        <div class="cell">z</div>
        <div class="cell">z</div>
    </div>
</div>

would become this:

<div class="row" data-ng-repeat-start="x in modal.xx">
    <div class="cell">y:</div>
    <div class="cell">y</div>
</div>
<div class="row" data-ng-repeat-end>
    <div class="cell">z</div>
    <div class="cell">z</div>
</div>

Upvotes: 3

Related Questions