我在hmtl5中创建了一个表,其中我使用js获取json数据并使用angular js循环遍历数据以下是html代码
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div class="container">
<div class="table-bordered table-responsive" ng-repeat="x in ddata">
<table class="table">
<thead>
<tr>
<th>Date</th>
<th>1</th>
<th>2</th>
<th>3</th>
<th>4</th>
<th>5</th>
<th>6</th>
<th>7</th>
<th>8</th>
<th>9</th>
<th>10</th>
<th>11</th>
<th>12</th>
<th>13</th>
<th>14</th>
<th>15</th>
<th>16</th>
<th>17</th>
<th>18</th>
<th>19</th>
<th>20</th>
<th>21</th>
<th>22</th>
<th>23</th>
<th>24</th>
<th>25</th>
<th>26</th>
<th>27</th>
<th>28</th>
<th>29</th>
<th>30</th>
<th>31</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="i in x" ng-if='i.month=="Nov"'>
<!--
<td>Nov</td>
<td> {{i.day}}</td>
<td> {{i.month}}</td>
-->
<td>Nov</td>
<td ng-if='i.day="01"'>{{(i.sgst/1000000)| currency:"₹"}}</td>
<td ng-if='i.day="02"'>{{(i.sgst/1000000)| currency:"₹"}}</td>
<td ng-if='i.day="03"'>{{(i.sgst/1000000)| currency:"₹"}}</td>
<td ng-if='i.day="04"'>{{(i.sgst/1000000)| currency:"₹"}}</td>
<td ng-if='i.day="05"'>{{(i.sgst/1000000)| currency:"₹"}}</td>
<td ng-if='i.day="06"'>{{(i.sgst/1000000)| currency:"₹"}}</td>
<td ng-if='i.day="07"'>{{(i.sgst/1000000)| currency:"₹"}}</td>
<td ng-if='i.day="08"'>{{(i.sgst/1000000)| currency:"₹"}}</td>
<td ng-if='i.day="09"'>{{(i.sgst/1000000)| currency:"₹"}}</td>
<td ng-if='i.day="10"'>{{(i.sgst/1000000)| currency:"₹"}}</td>
<td ng-if='i.day="11"'>{{(i.sgst/1000000)| currency:"₹"}}</td>
<td ng-if='i.day="12"'>{{(i.sgst/1000000)| currency:"₹"}}</td>
<td ng-if='i.day="13"'>{{(i.sgst/1000000)| currency:"₹"}}</td>
<td ng-if='i.day="14"'>{{(i.sgst/1000000)| currency:"₹"}}</td>
<td ng-if='i.day="15"'>{{(i.sgst/1000000)| currency:"₹"}}</td>
<td ng-if='i.day="16"'>{{(i.sgst/1000000)| currency:"₹"}}</td>
<td ng-if='i.day="17"'>{{(i.sgst/1000000)| currency:"₹"}}</td>
<td ng-if='i.day="18"'>{{(i.sgst/1000000)| currency:"₹"}}</td>
<td ng-if='i.day="19"'>{{(i.sgst/1000000)| currency:"₹"}}</td>
<td ng-if='i.day="20"'>{{(i.sgst/1000000)| currency:"₹"}}</td>
<td ng-if='i.day="21"'>{{(i.sgst/1000000)| currency:"₹"}}</td>
<td ng-if='i.day="22"'>{{(i.sgst/1000000)| currency:"₹"}}</td>
<td ng-if='i.day="23"'>{{(i.sgst/1000000)| currency:"₹"}}</td>
<td ng-if='i.day="24"'>{{(i.sgst/1000000)| currency:"₹"}}</td>
<td ng-if='i.day="25"'>{{(i.sgst/1000000)| currency:"₹"}}</td>
<td ng-if='i.day="26"'>{{(i.sgst/1000000)| currency:"₹"}}</td>
<td ng-if='i.day="27"'>{{(i.sgst/1000000)| currency:"₹"}}</td>
<td ng-if='i.day="28"'>{{(i.sgst/1000000)| currency:"₹"}}</td>
<td ng-if='i.day="29"'>{{(i.sgst/1000000)| currency:"₹"}}</td>
<td ng-if='i.day="30"'>{{(i.sgst/1000000)| currency:"₹"}}</td>
<td ng-if='i.day="31"'>{{(i.sgst/1000000)| currency:"₹"}}</td>
</tr>
</tbody>
</table>
</div>
</div>
</body>
现在我发布了一些我正在提取的json数据
{sgst: "5008688.00", month: "Jan", day: "01"}
:
{sgst: "0.00", month: "Aug", day: "01"}
:
{sgst: "5392323.00", month: "Sep", day: "01"}
:
{sgst: "630872.00", month: "Oct", day: "01"}
{sgst: "3258562.00", month: "Nov", day: "01"}
{sgst: "4985962.00", month: "Dec", day: "01"}
:
{sgst: "43685.00", month: "Aug", day: "02"}
:
{sgst: "1591974.00", month: "Sep", day: "02"}
:
{sgst: "3003474.00", month: "Oct", day: "02"}
:
{sgst: "2409776.00", month: "Nov", day: "02"}
:
{sgst: "3567207.00", month: "Dec", day: "02"}
:
{sgst: "31965.00", month: "Aug", day: "03"}
:
{sgst: "236068.00", month: "Sep", day: "03"}
:
{sgst: "6869161.00", month: "Oct", day: "03"}
:
{sgst: "5424188.00", month: "Nov", day: "03"}
:
{sgst: "113323.00", month: "Dec", day: "03"}
我希望第01天数据位于第1列,第2天数据位于第2列
之下使用上面的代码会发生什么,例如,如果11月的第01天的数据是3258562.00。 显示所有31列
的3258562.00第2天数据显示在整个第二行中。(所有列的数据相同) 等等
我希望数据在特定月份按日显示
nov day1data day2data day3data ........ dec day1data day2data dat3data ........
这个问题的任何解决方案?
答案 0 :(得分:0)
<tr >
<td id="monthname">Jan</td>
<td ng-repeat="n in [0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30]"> <span ng-if='jd[n]=="0"'>0</span> <span ng-if='jd[n]!="0"'>{{(jd[n]/100000)| currency:"₹"}}</span> </td>
</tr>
我没有写过ng-repeat,而是将其用于
对于1月份,ng-repeat将重复31次
同样地,我在剩下的11个月里又写了11个循环
<tr>
<td ng-repeat></td>
</tr>
此结构已在相应月份重复12次