user3052526 user3052526 - 4 months ago 7
AngularJS Question

ngRepeat weird behaviour

I can not believe that i am unable to do the simple following object made up of two arrays

{"M":
[
"Alpha",
"Beta",
"Zeta"],
"F":
[
"Alpha",
"Omega"
]}


All i want to do is have a nested ng-repeat like the following

<a
class="list-group-item list-group-item-info"
ng-repeat="(key,list) in vm.result">

{{key}}

<a
class="list-group-item"
ng-repeat="name in list">
{{name}}
</a>
</a>


any one has any idea why it does not work.

It shows the key properly, but fails to iterate in the list and hence the name is not shown and no errors are shown in the console either

thanks

Answer

bottom line of your problem:

https://www.w3.org/TR/html401/struct/links.html#h-12.2.2

nested links are illegal

Links and anchors defined by the A element must not be nested; an A element must not contain any other A elements.

Since the DTD defines the LINK element to be empty, LINK elements may not be nested either.

Change your outer element to a <div> or <span> and it works