2016-10-13 8 views
1

上記のPlunkerコードを調べて、予期したテーブルに合うように修正する手助けをしてもらえますか?下記を使用してHTMLテーブルを更新するJSON

私はAngularJS

This what has been Tried

予想されるHTMLの表の上に使用して取得していますJSON

{ 
    "PersonEvent": { 
    "Body": { 
     "Persons": { 
     "CurrentPersons": { 
      "Service": [ 
      { 
       "-PersonID": "TS029", 
       "PersonChangeActivity": "NoChange", 
       "Define": { 
       "PersonPCProduct": { 
        "-pn": "8000065" 
       } 
       } 
      }, 
      { 
       "-PersonID": "TS023", 
       "PersonChangeActivity": "NoChange", 
       "Define": { 
       "PersonPCProduct": { 
        "-pn": "8000005", 
        "Business": "Voice" 
       } 
       } 
      } 
      ] 
     }, 
     "PersonChanges": { 
      "PersonInstalls": { 
      "Service": [ 
       { 
       "-PersonID": "OT446", 
       "PersonChangeActivity": "Install", 
       "Define": { 
        "PersonPCProduct": { 
        "-pn": "2411", 
        "Business": "Video" 
        } 
       } 
       }, 
       { 
       "-PersonID": "VD034", 
       "PersonChangeActivity": "Install", 
       "Define": { 
        "PersonPCProduct": { 
        "-pn": "2552", 
        "Business": "Video" 
        } 
       } 
       } 
      ] 
      }, 
      "PersonDisconnects": { 
      "Service": [ 
       { 
       "-PersonID": "VD034", 
       "PersonChangeActivity": "Disconnect", 
       "Define": { 
        "PersonPCProduct": { 
        "-pn": "2552", 
        "Business": "Video" 
        } 
       } 
       }, 
       { 
       "-PersonID": "VP087", 
       "PersonChangeActivity": "Disconnect", 
       "Define": { 
        "PersonPCProduct": { 
        "-pn": "10400024", 
        "Business": "Video" 
        } 
       } 
       } 
      ] 
      } 
     } 
     } 
    } 
    } 
} 

角度JS

<tr ng-repeat="x in names">     
       <td ng-repeat="item in x.CurrentPersons.Service"> 
       {{item["-PersonID"]}}, {{item.PersonChangeActivity}} <br> 
       </td> 
       <td ng-repeat="name in x.PersonChanges.PersonInstalls.Service"> 
       {{name["-PersonID"]}},{{name.PersonChangeActivity}},{{name.Define.PersonPCProduct["-pn"]}} <br> 
       </td> 
       <td ng-repeat="disconnect in x.PersonChanges.PersonDisconnects.Service"> 
       {{disconnect["-PersonID"]}},{{disconnect.PersonChangeActivity}},{{disconnect.Define.PersonPCProduct["-pn"]}} <br> 
       </td> 
      </tr> 

実際のテーブル

Demo using Plunker

+1

あなたが最初の人に基づいて構造化するデータをマッピングし、必要とされ、それぞれの人の下のすべてのプロパティが含ま示唆 – charlietfl

答えて

1

NG-repeatが期待される出力を達成するために、表示された場合、私はちょうど変更。

ここでは、plunkerが更新されました。

<tr ng-repeat="x in names">    
 
    <td> 
 
    <span ng-repeat="item in x.CurrentPersons.Service"> 
 
    {{item["-PersonID"]}}, {{item.PersonChangeActivity}},{{item.Define.PersonPCProduct["-pn"]}} 
 
    <br> 
 
    </span> 
 
    </td> 
 
    <td> 
 
    <span ng-repeat="name in x.PersonChanges.PersonInstalls.Service"> 
 
    {{name["-PersonID"]}},{{name.PersonChangeActivity}},{{name.Define.PersonPCProduct["-pn"]}} <br> 
 
    </span> 
 
    </td> 
 
    <td> 
 
    <span ng-repeat="disconnect in x.PersonChanges.PersonDisconnects.Service"> 
 
     {{disconnect["-PersonID"]}},{{disconnect.PersonChangeActivity}},{{disconnect.Define.PersonPCProduct["-pn"]}} <br> 
 
    </span> 
 
    </td> 
 
</tr>

関連する問題