CODEWITHSUNDEEP
angularjsangularjs-ng-repeat
Code Grasshopper
Code Grasshopper

Reputation: 620

ng-repeat over a div not working

I have used ng-repeat numerous times already in the past, but for some reason I cannot yet understand why it is not on the following situation:

I have an array of objects called registers which I am referencing on the ng-repeat but nothing happens.

I know the array is populated because I have seen it on numerous console.log and because it works if I move the ng-repeat over to the <tbody>

<div ng-repeat = "r in registers">
        <!-- START HEADER -->
        <tbody class="js-table-sections-header">
            <tr>
                <td class="text-center">
                   <i class="fa fa-angle-right"></i>
                </td>
                <td class="font-w600">Denise Watson</td>
            </tr>

                </tbody> <!-- END HEADER -->
                <tbody>
                    <tr>
                        <td class="text-center"></td>
                        <td>
                        <!-- Summernote Container -->
                            <div class="js-summernote-air">
                                 <p>End of air-mode area!</p>
                            </div>

                       </td>
                  </tr>
            </tbody>
            <!--  END TABLE -->
        </div>

I was hoping someone could tell me if there is something I may be ignoring.

Thanks in advance.

Upvotes: 2

Views: 1670

Answers (2)

Mohideen bin Mohammed
Mohideen bin Mohammed

Reputation: 20137

If you want to use ng-repeat in "div" tag means use "span" inside div tag. instead of using "table" and its sub attributes..

else use your ng-repeat inside "table" or "thead" or "tr" also it will iterate rows ...

than only ng-repeat will works.

Upvotes: 1

pgreen2
pgreen2

Reputation: 3651

I think I just ran into this same problem. It stems from <div> not being a valid elment within a <table>.

I'm guessing that since you have <tbody> there, that there is a <table> tag that was left out of your snippet. <div>s aren't allowed in a table, so the browser moves it before the table. In my situation, doing this, causes the angular scope to change so that there was nothing to iterate over. You can verify this by using the developer tools of your browser.

So, my guess is that you probably want to move the ng-repeat onto the <tbody> or <table> tag.

Upvotes: 3

Related Questions