AngularJS - ng-repeat, dwie tablice. Pomoc w wyświetleniu.

0
<!DOCTYPE html>
<html lang="en" ng-app="todoApp">

<head>
  <meta charset="UTF-8">
  <title>todo App</title>
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
  <link rel="stylesheet" href="assets/css/bootstrap.min.css">
  <link rel="stylesheet" href="assets/css/app.css">
</head>

<body>
  <div class="container index_body" ng-controller="todoController">
    <div class="col-md-2"></div>
    <div class="col-md-8">
      <h2 class="text-center">todo() list!</h2>
      <hr>

      <!-- DODWANIE NOWYCH TODOS -->
      <form ng-submit="todoAdd()">
        <input type="text" ng-model="todoInput" size="60" placeholder="Add new todo by pressing enter" required>
        <input type="date" ng-model="dateInput"/>
        <button type="submit" value="Add new" class="btn btn-success"><i class="fa fa-plus-circle fa-2x"></i></button>
      </form>
      <br>

    <!-- WYŚWIETLANIE TODOS -->
      <div ng-repeat="elements in todoList">
        <input type="checkbox" ng-model="elements.done">
        <span ng-bind="elements.todoText" class="todoelem"></span>
        <br><br>
      </div>



    <!-- PRZYCISK DO USUWANIA ZAZNACZONYCH TODOS -->
      <p>
        <button ng-click="todoRemove()" class="btn btn-danger"><i class="fa fa-trash fa-2x"></i></button>
      </p>
    </div>
    <div class="col-md-2"></div>
  </div>
  <script src="app/lib/angular.js"></script>
  <script src="app/app.js"></script>
  <script src="app/controllers/todoController.js"></script>
</body>

</html>
 
todoApp.controller('todoController', ['$scope', function($scope) {



  $scope.todoList = [];
  $scope.dateList = [];



  $scope.todoAdd = function() {
    $scope.todoList.push({todoText:$scope.todoInput, done:false});
    $scope.todoInput = "";

    $scope.dateList.push({todoDate:$scope.dateInput});
    $scope.dateInput = "";

  }

  $scope.todoRemove = function() {
         var oldtodoList = $scope.todoList;
         $scope.todoList = [];
         angular.forEach(oldtodoList, function(elements) {
             if (!elements.done) $scope.todoList.push(elements);
         });
     };

}]);

Jak mogę wyświetlić te dwie tablice obok siebie? Wyświetlanie samej tablicy todoList, albo samej dateList działa, ale zależy mi, żeby wyświetlało je dwie obok siebie, tj. jeśli wypełnimy dwa inputy, to wartości pojawiają się obok "Tekst" "Data". Z góry dziękuję za wszelką pomoc. I przepraszam, jeśli ten temat był już poruszany.

0

Średnio rozumiem co dokładnie chcesz zrobić.
Może złącz to w jedną tablicę?

1

Przygotuj sobie w kontrolerze tablicę dwuwymiarową i tyle.

0

Już wszystko rozumiem. Dziękuję wszystkim za pomoc!

1 użytkowników online, w tym zalogowanych: 0, gości: 1