如何使用Ionic网格和AngularJS来解析数据

Question

如何使用Ionic网格和AngularJS构建此模板？ template image

我的AngularJS数据要返回：

name: name of candidate
voixgagne: total of voice
image: the candidate image

鉴于以下片段

[
  {
    "province": [
      {
        "nom": "Allen", 
        "voixgagne": 262843,
        "image": "img1.jpg"
      }, 
      {
        "nom": "Garrett", 
        "voixgagne": 590708,
        "image": "img1.jpg"
      }, 
      {
        "nom": "Bishop", 
        "voixgagne": 737962,
        "image": "img1.jpg"
      }, 
      {
        "nom": "Odessa", 
        "voixgagne": 759667,
        "image": "img1.jpg"
      }
    ], 
    "region": "Parleynet"
  }, 
  {
    "province": [
      {
        "nom": "Sybil", 
        "voixgagne": 487608,
        "image": "img1.jpg"
      }, 
      {
        "nom": "Hobbs", 
        "voixgagne": 316695,
        "image": "img1.jpg"
      }, 
      {
        "nom": "Branch", 
        "voixgagne": 873214
      }, 
      {
        "nom": "Savannah", 
        "voixgagne": 872420,
        "image": "img1.jpg"
      }
    ], 
    "region": "Skinserve"
  }, 
  {
    "province": [
      {
        "nom": "Trudy", 
        "voixgagne": 930841,
        "image": "img1.jpg"
      }, 
      {
        "nom": "Tabatha", 
        "voixgagne": 449455,
        "image": "img1.jpg"
      }, 
      {
        "nom": "Katie", 
        "voixgagne": 162203,
        "image": "img1.jpg"
      }, 
      {
        "nom": "Benjamin", 
        "voixgagne": 457185,
        "image": "img1.jpg"
      }
    ], 
    "region": "Optyk"
  }, 
  {
    "province": [
      {
        "nom": "Phoebe", 
        "voixgagne": 222252,
        "image": "img1.jpg"
      }, 
      {
        "nom": "Carlson", 
        "voixgagne": 984581,
        "image": "img1.jpg"
      }, 
      {
        "nom": "Maryann", 
        "voixgagne": 686871,
        "image": "img1.jpg"
      }, 
      {
        "nom": "Woodward", 
        "voixgagne": 943323,
        "image": "img1.jpg"
      }
    ], 
    "region": "Poshome"
  }
]

<div class="row" ng-repeat="stat in statistiques" ng-if="$index === 0">
   <div class="col col-33 col-offset-33">
      <div class="row">
         <div class="col"><a href="#/tab/dash/{{stat.nom}}"><img class="avatar" src="img/{{stat.image}}.jpg" ></a></div>
         <div class="col">
            <p class="percent">{{stat.voixgagne}}%</p>
         </div>
      </div>
   </div>
</div>
<div class="row" ng-repeat="stat in statistiques" ng-if="$index === 1">
   <div class="col col-33">
      <div class="row">
         <div class="col"><a href="#/tab/dash/{{stat.nom}}"><img class="avatar" src="img/{{stat.image}}.jpg"></a></div>
         <div class="col">
            <p class="percent">{{stat.voixgagne}}%</p>
         </div>
      </div>
   </div>
   <div class="col col-33 col-offset-33">
      <div class="row">
         <div class="col"><a href="#/tab/dash/{{statistiques[$index+1].nom}}"><img class="avatar" src="img/{{statistiques[$index+1].image}}.jpg"></a></div>
         <div class="col">
            <p class="percent">{{statistiques[$index+1].voixgagne}}%</p>
         </div>
      </div>
   </div>
</div>

非常感谢！