2015-02-06 2 views
0

Я искал где-то и нашел этот код, который мне нужен. Я работаю и задаюсь вопросом, как эта таблица создается с помощью angularjs. Я имею в виду, что я не понимаю этот процесс. Я смущен в этом tdCells[primaryarray][tdCells[primaryarray].length] = i+1 ; Что она используется, может кто-то помочь мне понять этоОбъясните, как эта таблица создана angularjs

var app = angular.module("myApp", []); 
 
app.controller('check', function($scope) { 
 
    $scope.totalSeats = 20; 
 
    $scope.seatArr = []; 
 
    for (var i = 1; i <= $scope.totalSeats; i++) { 
 
    $scope.seatArr.push(i); 
 
    } 
 

 
    console.log($scope.seatsArr); 
 

 
    $scope.myData = [{ 
 
    seatno: '1', 
 
    name: 'Melanie', 
 
    ticketnNo: "abc456", 
 
    insuranceNo: 34 
 
    }, { 
 
    seatno: '2', 
 
    name: 'JOsefa', 
 
    ticketnNo: "abc231", 
 
    insuranceNo: 90 
 
    }, { 
 
    seatno: '17', 
 
    name: 'Luna Marie', 
 
    ticketnNo: "abc324", 
 
    insuranceNo: 35 
 
    }, { 
 
    seatno: '5', 
 
    name: 'Jana', 
 
    ticketnNo: "abc221", 
 
    insuranceNo: 91 
 
    }, { 
 
    seatno: '18', 
 
    name: 'Scott Tooker', 
 
    ticketnNo: "abc453", 
 
    insuranceNo: 36 
 
    }, { 
 
    seatno: '6', 
 
    name: 'Malanies Santos', 
 
    ticketnNo: "abc241", 
 
    insuranceNo: 93 
 
    }, { 
 
    seatno: '20', 
 
    name: 'Luna Marie Landiola', 
 
    ticketnNo: "abc322", 
 
    insuranceNo: 39 
 
    }, { 
 
    seatno: '6', 
 
    name: 'Eliza', 
 
    ticketnNo: "abc222", 
 
    insuranceNo: 92 
 
    } ]; 
 
    
 
    $scope.getName = function(number){ 
 
     console.log(number); 
 
     for(var i=0;i<$scope.myData.length;i++){ 
 
      if(number == $scope.myData[i].seatno) 
 
       return $scope.myData[i].name; 
 
     } 
 
     return ''; 
 
    }; 
 
    var tdCells = []; 
 
    var primaryarray=-1; 
 
    for(var i=0;i<$scope.totalSeats;i++){ 
 
    if(i%3 ===0){ 
 
     ++primaryarray;   
 
     tdCells[primaryarray] = []; 
 
    } 
 
    
 
    tdCells[primaryarray][tdCells[primaryarray].length] = i+1 ;   
 
      tdCells[primaryarray][tdCells[primaryarray].length] = 
 
     $scope.getName(i+1);     
 
    } 
 
    $scope.rows = tdCells; 
 
    console.log($scope.rows); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<body ng-app="myApp" ng-controller="check"> 
 
    <table border="1" width="100%"> 
 
    <colgroup span="7"></colgroup> 
 
    <tbody> 
 
     <tr ng-repeat="tr in rows"> 
 
     <td ng-repeat="td in tr"> 
 
      {{ td }} 
 
     </td> 
 
     </tr> 
 
    </tbody> 
 
    </table> 
 
    </body>

+0

http://liamkaufman.com/blog/2013/05/13/understanding-angularjs-directives-part1-ng-repeat-and-compile/ –

+0

tdCells - это массив массивов. Каждая из последних ячеек получит счетчик 0 на основе 0, чтобы сделать его 1, а затем новая последняя ячейка получит имя также на основе – mplungjan

ответ

1

В коде функция $scope.getName(number) проста, она получает имя из массива данных на основе Номер места.

Для петли позже несколько сложно. Что она делает, я думаю, это: -

  • Это создает Два Diamentional массива tdCells с тремя колонками (if(i%3===0))
  • Для каждой строки в этой 2D массив tdCells: -
    • Он задает первый элемент seatnumber tdCells[primaryarray][tdCells[primaryarray].length] = i+1 ;
    • Он устанавливает второй элемент, который можно получить, используя функцию $scope.getName(...) выше. tdCells[primaryarray][tdCells[primaryarray].length] = $scope.getName(i+1);

В нг-повторить это просто делает массив 2D в стандартных столбцах - просто, что каждый столбец становится куплет seatnumber плюс имя.

HTH!

Смежные вопросы