<tr ng-model="check" ng-repeat="orderBook in orderBookDetails| orderBy: 'orderBook.no'" value='check=$scope.orderBookDetails.sowNo'>
<td ng-if='check!=orderBook.no'>{{orderBook.no}}</td>
<td>{{orderBook.location}}</td>
<td>{{orderBook.finYr}}</td>
<td ng-if='orderBook.amount1'>{{orderBook.amount1}}</td>
<td ng-if='!orderBook.amount1'></td>
<td ng-if='orderBook.amount2'>{{orderBook.amount2}}</td>
<td ng-if='!orderBook.amount2'></td>
<td ng-if='orderBook.amount3'>{{orderBook.amount3}}</td>
<td ng-if='!orderBook.amount3'></td>
<td>{{orderBook.amount1--orderBook.amount2--orderBook.amount3}}</td>
<td ng-if='orderBook.amount4'>{{orderBook.amount4}}</td>
<td ng-if='!orderBook.amount4'></td>
<td>
<button ng-click="getOrderBookDetails(orderBook.sowNo,orderBook.sowStartDate,orderBook.sowEndDate, orderBook.sowValuetoUSD);" class="btn btn-primary" data-toggle="modal" data-target="#add_new_record_modal">Update</button>
如果orderBook.no
相同,那么我只需将其放置一次,并在tr
td
我得到一张这样的表
SOW No Location Year Jan Feb March Cum Q4 update
001 italy 2016 1000 1000 Update
001 italy 2017 9000 12000 21000 Update
002 england 2017 1000 2000 3000 Update
但我需要一张像
这样的表格SOW No Location Year Jan Feb March Cum Q4 update
001 italy + 2016 1000 1000 Update
002 england - 2017 1000 2000 3000 Update
点击加号按钮我需要显示
SOW No Location Year Jan Feb March Cum Q4 update
001 italy - 2016 1000 1000
Update
2017 9000 12000 21000
002 england - 2017 1000 2000 3000 Update
每行有一个更新按钮。 我实现了像
<tr id="hideRow" ng-model="counter" value="counter=1"
ng-repeat="orderBook in orderBookDetails| orderBy: 'orderBook.no'"
ng-if='orderBook.index==0'>
<td>{{orderBook.index}}</td>
<td><img alt="Expand row" height="20px;"
ng-src="library/image/expand.jpg"
onclick="showRow('orderBook.no')">{{orderBook.no}}</td>
<td>{{orderBook.location}}</td>
<td>{{orderBook.finYr}}</td>
<td ng-if='orderBook.amount1'>{{orderBook.amount1}}</td>
<td ng-if='!orderBook.amount1'></td>
<td ng-if='orderBook.amount2'>{{orderBook.amount2}}</td>
<td ng-if='!orderBook.amount2'></td>
<td ng-if='orderBook.amount3'>{{orderBook.amount3}}</td>
<td ng-if='!orderBook.amount3'></td>
<td>{{orderBook.amount1--orderBook.amount2--orderBook.amount3}}</td>
<td ng-if='orderBook.amount4'>{{orderBook.amount4}}</td>
<td ng-if='!orderBook.amount4'></td>
<td><button
ng-click="getOrderBookDetails(orderBook.sowNo,orderBook.sowStartDate,orderBook.sowEndDate, orderBook.sowValuetoUSD);"
class="btn btn-primary" data-toggle="modal"
data-target="#add_new_record_modal">Update</button>
</tr>
<tr id="reloadRow"
ng-repeat="orderBook in orderBookDetails| orderBy: 'orderBook.no'"
ng-if='(orderBook.index!=0 || orderBook.no==$scope.curNo) && orderBook.no!=0'>
<td>{{orderBook.index}}+0</td>
<td><a ng-click="showRow('orderBook.no')"><img alt="Hide row" height="20px;"
ng-src="library/image/sow2.png"></a>{{orderBook.no}}</td>
<td>{{orderBook.location}}</td>
<td>{{orderBook.finYr}}</td>
<td ng-if='orderBook.amount1'>{{orderBook.amount1}}</td>
<td ng-if='!orderBook.amount1'></td>
<td ng-if='orderBook.amount2'>{{orderBook.amount2}}</td>
<td ng-if='!orderBook.amount2'></td>
<td ng-if='orderBook.amount3'>{{orderBook.amount3}}</td>
<td ng-if='!orderBook.amount3'></td>
<td>{{orderBook.amount1--orderBook.amount2--orderBook.amount3}}</td>
<td ng-if='orderBook.amount4'>{{orderBook.amount4}}</td>
<td ng-if='!orderBook.amount4'></td>
<td><button
ng-click="getOrderBookDetails(orderBook.sowNo,orderBook.sowStartDate,orderBook.sowEndDate, orderBook.sowValuetoUSD);"
class="btn btn-primary" data-toggle="modal"
data-target="#add_new_record_modal" disable="disabled">Update</button>
</tr>
ng-click无效。我已经包含了一个像第一次没有来自0其他1的索引
答案 0 :(得分:0)
我能够通过使用工厂重组数据来实现这一目标,因此看起来更像是这样:
$scope.orderBookDetails = {
'001':[
{
location:'Italy',
finYr:'2016',
amount1:1000,
amount2:2000
},
{
location:'Italy',
finYr:'2017',
amount1:1000
}
],
'002':[
..etc..
]
}
从那里,我使用嵌套表格显示每个订单号码的数据,并在+和 - 按钮上添加了一个ng-click事件,以便用其编号切换其他书籍。
<table>
<tr>
<th>SOW No</th>
<th>Location</th>
<th>Year</th>
<th>Jan</th>
<th>Feb</th>
<th>March</th>
<th>Cum Q4</th>
<th>Update</th>
</tr>
<tr ng-repeat="(key,orderBook) in orderBookDetails">
<td class="no_td">{{ key }}</td>
<td colspan="7">
<table ng-repeat="book in orderBook" class="book" ng-if="$index == 0 || orderBook.expanded">
<tr>
<td>{{ book.location }}</td>
<td>
<button class="expander" ng-click="expandBooks(orderBook)" ng-if="$index == 0">
<span ng-if="!orderBook.expanded && orderBook.length > 1">+</span>
<span ng-if="orderBook.expanded || orderBook.length <= 1">-</span>
</button>
<span class="spacer" ng-if="$index > 0"></span>
{{ book.finYr }}
</td>
<td>{{ book.amount1 }}</td>
<td>{{ book.amount2 }}</td>
<td>{{ book.amount3 }}</td>
<td>{{ book.amount1 + book.amount2 + book.amount3 }}</td>
<td><button ng-click="getOrderBookDetails(orderBook)" class="btn btn-primary" data-toggle="modal" data-target="#add_new_record_modal">Update</button></td>
</tr>
</table>
</td>
</tr>
</table>
这是一个显示我的解决方案的codepen:http://codepen.io/anon/pen/EZqObO
答案 1 :(得分:0)
我无法使用角度函数,所以我使用基本的jquery类型函数
<tr id="reloadRow" ng-repeat="orderBook in orderBookDetails| limitTo : 10 | orderBy: 'orderBook.no'"
ng-if='orderBook.index==0 || orderBook.no==curNo'>
<td>{{orderBook.index}}</td>
<td ng-if='orderBook.index==0 && orderBook.no==curNo'><img
alt="Hide row" height="20px;"
ng-src="library/image/minimize.jpg" ng-click="hideRow()"> {{orderBook.no}}</td>
<td ng-if='orderBook.index==0 && orderBook.no!=curNo'><img
alt="Hide row" height="20px;"
ng-src="library/image/expand.jpg"
ng-click="showingfull(orderBook.no)"> {{orderBook.no}}</td>
<td ng-if='orderBook.index!=0'></td></tr>
使用带有两个图像+和 - ,索引,curNo变量和两个函数的ng-click
$scope.showingfull = function(sowNo) {
alert("Inside brand new showing method");
$scope.curNo = sowNo;
}
$scope.hideRow = function() {
$scope.curNo = 0;
}