2017-01-15 17 views
5
<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> 

Jeśli orderBook.no jest taka sama to muszę postawić, że tylko raz i dodać tr obrębie tdchcę wyświetlić wiersz tabeli jako wewnętrzna wiersza tabeli jeśli pierwsze pole jest taka sama, jak wykonać ten

I dostać stolik jak ten

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 

Ale muszę tabeli jak

SOW No Location  Year Jan Feb March Cum Q4 update 
    001 italy  + 2016 1000     1000 Update 
    002 england - 2017 1000 2000   3000  Update 

Onclick przycisk plus i trzeba wyświetlić

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 

z jednego przycisku aktualizacji za rzędzie. Mam zaimplementowane jak

<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 nie działa. Mam włączone wskaźnik jak na raz pierwszy nie chodzi jej 0 else 1

+0

co jeśli się zmieniłeś twój 'orderBookDetails' jest tablicą' array [orderBook] '.. więc, gdy renderujesz element, sprawdzasz jego długość –

Odpowiedz

0

nie jestem w stanie zrobić z funkcją kątowego tak zrobiłem z podstawowymi funkcjami typu 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()">&nbsp;{{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)">&nbsp;{{orderBook.no}}</td> 
    <td ng-if='orderBook.index!=0'></td></tr> 

NG-click z dwóch obrazy + i -, indeks, curNo zmienne i dwie funkcje są używane

$scope.showingfull = function(sowNo) { 
       alert("Inside brand new showing method"); 
       $scope.curNo = sowNo; 
      } 


$scope.hideRow = function() { 
        $scope.curNo = 0; 
       } 
0

udało mi się uzyskać to do pracy poprzez restrukturyzację danych przy użyciu fabryki, więc wyglądało to mniej więcej tak:

$scope.orderBookDetails = { 
    '001':[ 
    { 
     location:'Italy', 
     finYr:'2016', 
     amount1:1000, 
     amount2:2000 
    }, 
    { 
     location:'Italy', 
     finYr:'2017', 
     amount1:1000 
    } 
    ], 
    '002':[ 
    ..etc.. 
    ] 
} 

Od tam użyłem tabel zagnieżdżonych do wyświetlania danych dla każdego numeru zamówienia i dodałem zdarzenie typu ng-click do przycisków + i -, aby przełączać inne książki o tym numerze.

<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> 

Oto codepen pokazując moje rozwiązanie: http://codepen.io/anon/pen/EZqObO

+0

Dzięki za kod kątowy –