我可以在里面的td表中使用两个ng-repeat吗?

问题描述 投票:0回答:1

my current result Expected result 请指导我如何在一个td内使用两个ng-repeat。当我没有得到预期结果后我使用span标签。我在td中使用了一个ng-repat,而其他我在span标签中使用了所以我没有得到预期的结果所以如何在一个td中使用两个ng-repeat。

var app = angular.module("myApp", []);
         app.controller("myCtrl", function($scope) {

           $scope.records = [
             {"year":2006,"quarters":{"q4":{"kk":5.0,"fl":0.0}}},{"year":2007,"quarters":{"q1":{"kk":9.0,"fl":0.0},"q2":{"kk":8.0,"fl":0.0},"q3":{"kk":7.0,"fl":0.0},"q4":{"kk":6.0,"fl":0.0}}},{"year":2008,"quarters":{"q1":{"kk":5.0,"fl":0.0},"q2":{"kk":4.0,"fl":0.0},"q3":{"kk":3.0,"fl":0.0},"q4":{"kk":4.0,"fl":0.0}}},{"year":2009,"quarters":{"q1":{"kk":5.0,"fl":0.0},"q2":{"kk":6.0,"fl":0.0},"q3":{"kk":7.0,"fl":0.0},"q4":{"kk":6.0,"fl":0.0}}},{"year":2010,"quarters":{"q1":{"kk":7.0,"fl":0.0},"q2":{"kk":5.0,"fl":0.0},"q3":{"kk":7.0,"fl":0.0},"q4":{"kk":6.0,"fl":0.0}}},{"year":2011,"quarters":{"q1":{"kk":8.0,"fl":0.0},"q2":{"kk":7.0,"fl":0.0},"q3":{"kk":9.0,"fl":0.0},"q4":{"kk":8.0,"fl":0.0}}},{"year":2012,"quarters":{"q1":{"kk":0.0,"fl":0.0},"q2":{"kk":9.0,"fl":0.0},"q3":{"kk":8.0,"fl":0.0},"q4":{"kk":7.0,"fl":0.0}}},{"year":2013,"quarters":{"q1":{"kk":6.0,"fl":0.0},"q2":{"kk":5.0,"fl":0.0},"q3":{"kk":4.0,"fl":0.0},"q4":{"kk":0.0,"fl":0.0}}},{"year":2014,"quarters":{"q1":{"kk":3.0,"fl":0.0},"q2":{"kk":2.0,"fl":0.0},"q3":{"kk":3.0,"fl":0.0},"q4":{"kk":4.0,"fl":0.0}}},{"year":2015,"quarters":{"q1":{"kk":5.0,"fl":0.0},"q2":{"kk":0.0,"fl":0.0},"q3":{"kk":6.0,"fl":0.0},"q4":{"kk":7.0,"fl":0.0}}},{"year":2016,"quarters":{"q1":{"kk":0.0,"fl":0.0},"q2":{"kk":5.0,"fl":0.0},"q3":{"kk":4.0,"fl":0.0},"q4":{"kk":4.0,"fl":0.0}}},{"year":2017,"quarters":{"q1":{"kk":3.0,"fl":0.0},"q2":{"kk":8.0,"fl":0.0},"q3":{"kk":3.0,"fl":0.0},"q4":{"kk":5.0,"fl":0.0}}},{"year":2018,"quarters":{"q1":{"kk":6.0,"fl":0.0},"q2":{"kk":7.0,"fl":0.0},"q3":{"kk":8.0,"fl":0.0},"q4":{"kk":3.0,"fl":0.0}}},{"year":2019,"quarters":{"q1":{"kk":2.0,"fl":0.0},"q2":{"kk":4.0,"fl":0.0},"q3":{"kk":6.0,"fl":0.0},"q4":{"kk":7.0,"fl":0.0}}},{"year":2020,"quarters":{"q1":{"kk":8.0,"fl":0.0}}}
           ]
          
        });
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.2/angular.min.js"></script>
<table class="table table-bordered" ng-app="myApp" ng-controller="myCtrl">
    <tr>
      <th colspan="2">Year</th>
      
       <td colspan="4" data-ng-repeat="years in records" ng-bind="years.year"></td>
      
    </tr>
    <tr>
      <td style="border:0">Question</td>
      <td style="border:0">&nbsp;</td>
     <td data-ng-repeat="years in records">
                  <span class="yearStyle text-center"  data-ng-repeat="(key, value) in years.quarters"
                              data-ng-init="asdasd()" ng-bind="key "></span>
      
    </tr>
	
	<tr>
    <td rowspan="3" colspan="1">A205</td>
    <td>KK</td>
    <td data-ng-repeat="years in records"><input type="number" class="yearStyle  text-center" data-ng-repeat="(key, value) in years.quarters"
                            ng-bind="value.kk" ng-model="value.kk"></td>
  </tr>
 
  <tr>
    <td>FL</td>
   <td data-ng-repeat="years in records"><input type="number" class="yearStyle  text-center" data-ng-repeat="(key, value) in years.quarters"
                            ng-bind="value.fl" ng-model="value.fl"></td>
   
  </tr>
 
  <tr>
    <td>Total</td>
   <td data-ng-repeat="years in records"><input type="number" class="yearStyle  text-center" data-ng-repeat="(key, value) in years.quarters"
                            ng-bind="value.fl + value.kk" ng-model="value.fl + value.kk"></td>

  

  </table>
javascript jquery html angularjs
1个回答
0
投票

问题出在你的json数据中。你应该在years.quarters json属性中有一个对象数组,这样它就可以循环数据-ng-repeat =“(key,value)in years.quarters”目前,你的years.quarters属性是一个对象

© www.soinside.com 2019 - 2024. All rights reserved.