Cómo podría representar un objeto de objetos en Angular pero sin convertirlo en una matriz o algo similar. La razón de esto es que tengo un gran objeto de objetos y me gustaría evitar muchas iteraciones del objeto a una matriz después de eso para hacer un bucle en la matriz en el html.

Por ejemplo tengo:

 persons: any = { 0: { name: 'name1', email: 'name1@gmail.com' }, 1: { name: 'name2', email: 'name2@gmail.com' }, 2: { name: 'name3', email: 'name3@gmail.com' } }

Cuando lo hago es lo siguiente:

 <div *ngFor="let person of persons | keyvalue"> <p> {{ person.key }} / {{ person.value }} </p> </div>

El resultado es:

 0 / [object Object] 1 / [object Object] 2 / [object Object]

Traté de hacer un bucle una vez más a través de person.value:

 <div *ngFor="let person of persons | keyvalue;"> <p> {{ person.key }} <span *ngFor="let item of person.value | keyvalue"></span> </p> </div>

pero esto provoca un error ("Ninguna sobrecarga coincide con esta llamada").

¿Alguien podría decirme cómo podría lograr esto?