Wie json auf angular2 zu parsen?

Question

`ve diesen Code analysiert,

[ 
    {"nodename":"192.124.105.55", 
    "servicelist":[ 
     { 
     "id":"ec9471ec001c10b9fa286e1f52e39c5dc9485a7c2cfbf55145c26242bb98ec4d", 
     "name":"Nginx", 
     "status":"Online", 
     "servicecontrolled":true 
     }, 
     { 
      "id":"f4ca9e0badc6b23e3e36444bd7ee4a9efcd39de8e0bb4cdecb25b5a02ef86ba5", 
      "name":"Memcached", 
      "status":"Offline", 
     "servicecontrolled":true   
     }, 
     { 
      "id":"0a4bf3b5bb5f47ece9284052389ae02f6c9dba989ca34086a30e049ee3d8eb47", 
      "name":"Celery", 
      "status":"Offline", 
     "servicecontrolled":true 
     } 
    ], 
    "storagelist": 
    [ 
    { 
     "mountpoint":"/", 
     "total":188, 
     "used":28, 
     "free":161 
    }, 
    { 
     "mountpoint":"/boot", 
     "total":235, 
     "used":106, 
     "free":129 
    } 
    ], 
"system": 
{ 
     "memory": 
    { 
     "total":33673834496, 
     "used":14725959680, 
     "free":18947874816, 
     "actualfree":24221499392, 
     "actualused":9452335104, 
     "swaptotal":34296819712, 
     "swapused":0, 
     "swapfree":34296819712 
     }, 
     "uptime":" 4:09", 
     "loadaverage":"0.91 0.49 0.54", 
     "cpu": 
       { 
        "vendor":"GenuineIntel", 
        "family":"6", 
        "model":"Intel(R) Xeon(R) CPU   E5620 @ 2.40GHz", 
        "rate":"2399.971", 
        "numofcores":2 
       } 
    } 
}, 
    {"nodename":"192.124.105.58", 
    "servicelist":[ 
     {"id":"428d3cc1d4d7218d6b9d1a80152179fac0aba40e2eee5525befe1355919db5e6", 
     "name":"Nginx", 
     "status":"Online" 
     }, 
     { 
      "id":"9f71381ff2e2181b4dde841e85d7d29af33fc2bd1929092aedf237d124ae75e0", 
      "name":"Memcached", 
      "status":"Online" 
     }, 
     { 
      "id":"c7dc289c490b8087d47971a45d545fcbbf7f425b1087179ae4a05c585c859302", 
      "name":"gunicorn", 
      "status":"Online" 
     }, 
     { 
      "id":"a96c90d2423c4e300d8d1d83b2e4dfdd70af9ca0ae91bdba35a66dd9ffa2f572", 
      "name":"test", 
      "status":"Offline" 
      } 
     ], 
     "storagelist": [], 
     "system": 
     { 
       "memory": 
       { 
        "total":12425734566, 
        "used":4725959680, 
        "free":8947874816, 
        "actualfree":4221499392, 
       "actualused":452335104, 
       "swaptotal":4296819712, 
       "swapused":0, 
       "swapfree":4296819712 
       }, 
       "uptime":" 12 days, 4:09", 
       "loadaverage":"0.00 0.00 0.00", 
       "cpu": 
       { 
        "vendor":"GenuineIntel", 
        "family":"6", 
        "model":"Intel(R) Xeon(R) CPU   E5620 @ 2.40GHz", 
        "rate":"2399.971", 
        "numofcores":4 
       } 
      } 
    } 
] 

"nodename", "Dienstliste", "storagelist" alles in Ordnung ist, aber "System" und "Speicher" analysiert Dont.

Das ist mein html ->

<h1> Мониторинг сервисов (M.S.A) </h1> 
    <table class="table table-bordered" *ngFor="let list of lists"> 
    <caption>{{ list.nodename }}</caption> 
    <thead> 
     <tr> 
      <th>Название сервиса</th> 
      <th></th> 
      <th>Операции</th> 
      <th>Статус</th> 
     </tr> 
     </thead> 
     <tbody> 
      <tr *ngFor="let service_rec of list.servicelist"> 
       <td> {{ service_rec.name }} </td> 
       <td></td> 
       <td></td> 
       <td style="width: 15%"> 
        <span [style.background-color]="service_rec.status == 'Online' ? 'green' : 'red'" 
        class="label label-default"> 
        {{ service_rec.status }} 
        </span> 
       </td>  
      </tr> 
     </tbody> 
     <thead> 
       <tr> 
        <th>Файловая система</th> 
        <th>Всего</th> 
        <th>Использовано</th> 
        <th>Доступно</th> 
       </tr> 
      </thead> 
      <tbody> 
       <tr *ngFor="let service_rec of list.storagelist"> 
        <td> {{ service_rec.mountpoint }} </td> 
        <td> {{ service_rec.total | byteFormat }} </td> 
        <td> {{ service_rec.used | byteFormat }} </td> 
        <td> {{ service_rec.free | byteFormat }} </td> 
       </tr> 
      </tbody> 
      <thead> 
       <tr> 
        <th>Общая память</th> 
        <th>Общая используемая память</th> 
        <th>Свободная память</th> 
        <th>Используемая память размера подкачки</th> 
       </tr> 
      </thead> 
      <tbody> 
       <tr *ngFor="let perem of system.memory"> 
        <td> {{perem.total}} </td> 
        <td> {{perem.actualused}} </td> 
        <td> {{perem.actualfree}} </td> 
        <td> {{perem.swapused}} </td> 
       </tr> 
      </tbody> 
     </table> 

Wie diese json analysieren? Mit etwas Rohr? Und wie kann ich "CPU" parsen ?? Ich weiß, dass das que. ist sehr beliebt bei stackovetflow, aber ich finde es mit meinem Problem

Answer 1

Es ist, weil ngFor akzeptiert nur Arrays und keine Objekte. Alle Ihr Objekt korrekt analysiert wird, aber die system.memory kann nicht behandelt werden ...

"system": { 
    "memory": { (...) } // <----- object 

Wenn Sie iterieren Schlüssel im Objekt, müssen Sie eine benutzerdefinierte Rohr implementieren.

• access key and value of object using *ngFor