Question

{  
   "ldoc":{  
      "SOLD":{  
         "range":{  
            "1 - 2":0,
            "No LDOC":2,
            "0 - 0":0,
            "8 - 14":1,
            "15+":2,
            "3 - 7":7
         }
      },
      "STOCK":{  
         "range":{  
            "1 - 2":0,
            "No LDOC":2,
            "0 - 0":0,
            "8 - 14":20,
            "15+":13,
            "3 - 7":6
         }
      }
   }
}

如何使用角度js以表格格式显示此数据。请给我一些方法。这些数据是动态的。

Answer 1

检查工作fiddle 这就是你如何在表格中显示数据。

<div ng-app='myApp'>
    <div class="wrapper" ng-controller="Main">
        <table>
            <tr>
                <th>SOLD</th>
                <th>STOCK</th>
            </tr>
            <tbody>
                <tr>
                    <td>{{jsonObject.ldoc.SOLD.range["1 - 2"]}}</td>
                    <td>{{jsonObject.ldoc.STOCK.range["1 - 2"]}}</td>
                </tr>
                <tr>
                    <td>{{jsonObject.ldoc.SOLD.range["No LDOC"]}}</td>
                    <td>{{jsonObject.ldoc.STOCK.range["No LDOC"]}}</td>
                </tr>
                <tr>
                    <td>{{jsonObject.ldoc.SOLD.range["0 - 0"]}}</td>
                    <td>{{jsonObject.ldoc.STOCK.range["0 - 0"]}}</td>
                </tr>
                <tr>
                    <td>{{jsonObject.ldoc.SOLD.range["8 - 14"]}}</td>
                    <td>{{jsonObject.ldoc.STOCK.range["8 - 14"]}}</td>
                </tr>
                <tr>
                    <td>{{jsonObject.ldoc.SOLD.range["15+"]}}</td>
                    <td>{{jsonObject.ldoc.STOCK.range["15+"]}}</td>
                </tr>
                <tr>
                    <td>{{jsonObject.ldoc.SOLD.range["3 - 7"]}}</td>
                    <td>{{jsonObject.ldoc.STOCK.range["3 - 7"]}}</td>
                </tr>
            </tbody>
        </table>
    </div>
</div>

你的Angular应用程序：

var myApp = angular.module('myApp', []);

    myApp.controller('Main', function($scope){
        $scope.jsonObject = {  
           "ldoc":{  
              "SOLD":{  
                 "range":{  
                    "1 - 2":0,
                    "No LDOC":2,
                    "0 - 0":0,
                    "8 - 14":1,
                    "15+":2,
                    "3 - 7":7
                 }
              },
              "STOCK":{  
                 "range":{  
                    "1 - 2":0,
                    "No LDOC":2,
                    "0 - 0":0,
                    "8 - 14":20,
                    "15+":13,
                    "3 - 7":6
                 }
              }
           }
        };

    });

如何使用angularjs在表格中显示JSON

1 个答案: