Skip to main content
se añadieron 6 caracteres en el cuerpo
Origen Enlace
hawks
  • 3.5k
  • 1
  • 6
  • 16

Tienes que verlo como una colección de objetos el array "principal" y luego cada objeto en la propiedad series contiene otra lista de objetos.

[
 {
    name: "x",
    series: [{...}, {...}, ....] // el ngFor de dentro itera estos datos
 },
 {
    name: "y",
    series: [{...}, {...}, ....]
 },
] // Array de objetos

He llamado items a la colección de objetos, deberías cambiarla con la variable que tengas en el component.ts.

<table>
 <thead>
  <tr>
    <th>Fecha</th>
    <th>Estado 1</th>
    <th>Estado 2</th>
    <th>Total</th>
  </tr>
 </thead>

<tbody>

   <ng-container *ngFor="let item of items; let i = index">
     <tr *ngFor="let serie of item.series; let j = index">
       <td>{{serie.name | date:'yyyy/MM/dd'}}</td>
       <td>{{serie.value}}</td>
       <td>{{serieitem.series.length}}</td>
     </tr>
   </ng-container>
</tbody>
</table>

He actualizado mi respuesta, para adaptarlo a la imagen de la tabla. La columna (Estado 2) no se que valor debería tener.

Tienes que verlo como una colección de objetos el array "principal" y luego cada objeto en la propiedad series contiene otra lista de objetos.

[
 {
    name: "x",
    series: [{...}, {...}, ....] // el ngFor de dentro itera estos datos
 },
 {
    name: "y",
    series: [{...}, {...}, ....]
 },
] // Array de objetos

He llamado items a la colección de objetos, deberías cambiarla con la variable que tengas en el component.ts.

<table>
 <thead>
  <tr>
    <th>Fecha</th>
    <th>Estado 1</th>
    <th>Estado 2</th>
    <th>Total</th>
  </tr>
 </thead>

<tbody>

   <ng-container *ngFor="let item of items; let i = index">
     <tr *ngFor="let serie of item.series; let j = index">
       <td>{{serie.name | date:'yyyy/MM/dd'}}</td>
       <td>{{serie.value}}</td>
       <td>{{serie.length}}</td>
     </tr>
   </ng-container>
</tbody>
</table>

He actualizado mi respuesta, para adaptarlo a la imagen de la tabla. La columna (Estado 2) no se que valor debería tener.

Tienes que verlo como una colección de objetos el array "principal" y luego cada objeto en la propiedad series contiene otra lista de objetos.

[
 {
    name: "x",
    series: [{...}, {...}, ....] // el ngFor de dentro itera estos datos
 },
 {
    name: "y",
    series: [{...}, {...}, ....]
 },
] // Array de objetos

He llamado items a la colección de objetos, deberías cambiarla con la variable que tengas en el component.ts.

<table>
 <thead>
  <tr>
    <th>Fecha</th>
    <th>Estado 1</th>
    <th>Estado 2</th>
    <th>Total</th>
  </tr>
 </thead>

<tbody>

   <ng-container *ngFor="let item of items; let i = index">
     <tr *ngFor="let serie of item.series; let j = index">
       <td>{{serie.name | date:'yyyy/MM/dd'}}</td>
       <td>{{serie.value}}</td>
       <td>{{item.series.length}}</td>
     </tr>
   </ng-container>
</tbody>
</table>

He actualizado mi respuesta, para adaptarlo a la imagen de la tabla. La columna (Estado 2) no se que valor debería tener.

se añadieron 10 caracteres en el cuerpo
Origen Enlace
hawks
  • 3.5k
  • 1
  • 6
  • 16

Tienes que verlo como una colección de objetos el array "principal" y luego cada objeto en la propiedad series contiene otra lista de objetos.

[
 {
    name: "x",
    series: [{...}, {...}, ....] // el ngFor de dentro itera estos datos
 },
 {
    name: "y",
    series: [{...}, {...}, ....]
 },
] // Array de objetos

He llamado items a la colección de objetos, deberías cambiarla con la variable que tengas en el component.ts.


 <table>
 <thead>
  <tr>
    <th>Fecha</th>
    <th>Estado 1</th>
    <th>Estado 2</th>
    <th>Total</th>
  </tr>
 </thead>
</table>

<tbody>

<tr   <ng-container *ngFor="let item of items; let i = index">
<!-- item es el objeto individual -->
     <td>{{item.name | date:'yyyy/MM/dd'}}</td>
     <td>{{item.value}}</td> <!-- Esta propiedad no existe el objeto de la imagen -->
     <tr *ngFor="let serie of item.series; let j = index">
       <td>{{serie.name | date:'yyyy/MM/dd'}}</td>
       <td>{{serie.value}}</td>
       <td>{{serie.length}}</tr>td>
     </tr>
   </ng-container>
</tbody>
</table>

He actualizado mi respuesta, para adaptarlo a la imagen de la tabla. La columna (Estado 2) no se que valor debería tener.

Tienes que verlo como una colección de objetos el array "principal" y luego cada objeto en la propiedad series contiene otra lista de objetos.

[
 {
    name: "x",
    series: [{...}, {...}, ....] // el ngFor de dentro itera estos datos
 },
 {
    name: "y",
    series: [{...}, {...}, ....]
 },
] // Array de objetos

He llamado items a la colección de objetos, deberías cambiarla con la variable que tengas en el component.ts.


 <table>
 <thead>
  <tr>
    <th>Fecha</th>
    <th>Estado 1</th>
    <th>Estado 2</th>
    <th>Total</th>
  </tr>
 </thead>
</table>

<tbody>

<tr *ngFor="let item of items; let i = index">
<!-- item es el objeto individual -->
     <td>{{item.name | date:'yyyy/MM/dd'}}</td>
     <td>{{item.value}}</td> <!-- Esta propiedad no existe el objeto de la imagen -->
     <tr *ngFor="let serie of item.series; let j = index">
       <td>{{serie.name | date:'yyyy/MM/dd'}}</td>
       <td>{{serie.value}}</td>
     </tr>
 </tr>

</tbody>

Tienes que verlo como una colección de objetos el array "principal" y luego cada objeto en la propiedad series contiene otra lista de objetos.

[
 {
    name: "x",
    series: [{...}, {...}, ....] // el ngFor de dentro itera estos datos
 },
 {
    name: "y",
    series: [{...}, {...}, ....]
 },
] // Array de objetos

He llamado items a la colección de objetos, deberías cambiarla con la variable que tengas en el component.ts.

<table>
 <thead>
  <tr>
    <th>Fecha</th>
    <th>Estado 1</th>
    <th>Estado 2</th>
    <th>Total</th>
  </tr>
 </thead>

<tbody>

   <ng-container *ngFor="let item of items; let i = index">
     <tr *ngFor="let serie of item.series; let j = index">
       <td>{{serie.name | date:'yyyy/MM/dd'}}</td>
       <td>{{serie.value}}</td>
       <td>{{serie.length}}</td>
     </tr>
   </ng-container>
</tbody>
</table>

He actualizado mi respuesta, para adaptarlo a la imagen de la tabla. La columna (Estado 2) no se que valor debería tener.

Array modificado, tabla ilustrativa, modificación del codigo
Origen Enlace

Tienes que verlo como una colección de objetos el array "principal" y luego cada objeto en la propiedad series contiene otra lista de objetos.

[
 {
    name: "x",
    series: [{...}, {...}, ....] // el ngFor de dentro itera estos datos
 },
 {
    name: "y",
    series: [{...}, {...}, ....]
 },
] // Array de objetos

He llamado items a la colección de objetos, deberías cambiarla con la variable que tengas en el component.ts.


<table>
 <thead>
  <tr>
    <th>Fecha</th>
    <th>Estado 1</th>
    <th>Estado 2</th>
    <th>Total</th>
  </tr>
 </thead>
</table>

<tbody>

<tr *ngFor="let item of items; let i = index">
<!-- item es el objeto individual -->
     <td>{{item.name | date:'yyyy/MM/dd'}}</td>
     <td>{{item.value}}</td> <!-- Esta propiedad no existe el objeto de la imagen -->
     <tr *ngFor="let serie of item.series; let j = index">
       <td>{{serie.name | date:'yyyy/MM/dd'}}</td>
       <td>{{serie.value}}</td>
     </tr>
 </tr>

</tbody>

Tienes que verlo como una colección de objetos el array "principal" y luego cada objeto en la propiedad series contiene otra lista de objetos.

[
 {
    name: "x",
    series: [{...}, {...}, ....] // el ngFor de dentro itera estos datos
 },
 {
    name: "y",
    series: [{...}, {...}, ....]
 },
] // Array de objetos

He llamado items a la colección de objetos, deberías cambiarla con la variable que tengas en el component.ts.

<tr *ngFor="let item of items; let i = index">
<!-- item es el objeto individual -->
     <td>{{item.name | date:'yyyy/MM/dd'}}</td>
     <td>{{item.value}}</td> <!-- Esta propiedad no existe el objeto de la imagen -->
     <tr *ngFor="let serie of item.series; let j = index">
       <td>{{serie.name | date:'yyyy/MM/dd'}}</td>
       <td>{{serie.value}}</td>
     </tr>
 </tr>

Tienes que verlo como una colección de objetos el array "principal" y luego cada objeto en la propiedad series contiene otra lista de objetos.

[
 {
    name: "x",
    series: [{...}, {...}, ....] // el ngFor de dentro itera estos datos
 },
 {
    name: "y",
    series: [{...}, {...}, ....]
 },
] // Array de objetos

He llamado items a la colección de objetos, deberías cambiarla con la variable que tengas en el component.ts.


<table>
 <thead>
  <tr>
    <th>Fecha</th>
    <th>Estado 1</th>
    <th>Estado 2</th>
    <th>Total</th>
  </tr>
 </thead>
</table>

<tbody>

<tr *ngFor="let item of items; let i = index">
<!-- item es el objeto individual -->
     <td>{{item.name | date:'yyyy/MM/dd'}}</td>
     <td>{{item.value}}</td> <!-- Esta propiedad no existe el objeto de la imagen -->
     <tr *ngFor="let serie of item.series; let j = index">
       <td>{{serie.name | date:'yyyy/MM/dd'}}</td>
       <td>{{serie.value}}</td>
     </tr>
 </tr>

</tbody>
Origen Enlace
hawks
  • 3.5k
  • 1
  • 6
  • 16
Loading