[solved] Ng-repeat only working on li and item (not div, span, p)

ionic-v1
1

I can’t get ng-repeat to work on anything other than a <li> or <item> tag. If it’s in a div, span, p, or anything else, it doesn’t visually display (although inspecting the source in the browser shows it is in fact there).

How do i get ng-repeat to work properly. What part of ionic overwrites or mess with that functionality?

2

This sample works on <div>

<div ng-repeat="number in myList">{{number}}</div>

3

For some reason it required me to put a border around the containing element in order for it to display on page.

    <div><h1 class="webfont">Title</h1></div>
    <div data-ng-controller="myctrl" style="border: 1px solid #fff;">
          <div ng-repeat="things in thing">
            {{things.whatever}}
          </div>
     </div>

So I dove into my SASS and started deleting blocks of code and seeing which caused the undesired effect. And it came down to a web font declaration for an element font: 18px 'googlewebfont';

@font-face {
    font-family: 'googlewebfont';
    src: url('../lib/fonts/googlewebfont-webfont.eot');
    src: url('../lib/fonts/googlewebfont-webfont.eot?#iefix') format('embedded-opentype'),
         url('../lib/fonts/googlewebfont-webfont.woff') format('woff'),
         url('../lib/fonts/googlewebfont-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

Disabling the font in the developer console on the browser allowed it to display the div properly; re-enabling the font via console did not reproduce the error again. (ie i just clicked the css property check box to turn it off (fixed), on (didn’t break)). But when refreshing or rendering the page it would break.

The 1px border is a fix to get it working for now; but pretty strange.