как отображать данные в следующей строке в ng-repeat?

Question

Мне нужно отобразить данные в следующей строке внутри цикла ng-repeat. Но я не могу найти, как это сделать. Может ли кто-нибудь предложить мне, как это сделать. JS:

$scope.array ={dates:[]}; 
$scope.array ({display:display}); 
var display = day+ "\n" + date; 

Здесь день = пн, вт, и т.д., и дата содержит 4,5,6 .. и т.д .. я хочу показать это как,

MON  TUE 
5  6 

HTML:

<div class="col" style="border-right: solid 1px #820d13; " ng-repeat="days in array"> 
    <p class="delivery_date" ng-if="days.date != undefined" style="transform: rotate(270deg);margin-top: 8px;font-size: 12px;font-weight: 600;text-transform: uppercase;"> 
{{days.display}} 
    </p></div> 

Answer 1

angular.module('todoApp', []).controller('TodoController', function($scope) { 
 
    $scope.array = { 
 
    'date': ['Mon 5', 'Tue 6'] 
 
    }; 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="todoApp" ng-controller="TodoController"> 
 
    <div ng-repeat="date in array.date"> 
 
    <p>{{date.split(' ')[0]}} 
 
     <p> 
 
     <p>{{date.split(' ')[1]}} 
 
      <p> 
 
    </div> 
 

 
</div>

Между {{ }} вы можете написать код javascript и угловой анализ и запустить его.

Answer 2

HTML:

<div ng-app="myapp" ng-controller="myctrl"> 
    <p ng-repeat="k in array.dates">{{ k.split(' ')[0] }} <br /> {{ k.split(' ')[1] }}</p> 
</div> 

Сценарий:

angular.module('myapp',[]) 
.controller('myctrl',function($scope){ 
    $scope.array ={dates:['MON 5', 'TUE 6']}; 
}); 

Answer 3

Пожалуйста, проверьте, если это то, что вам нужно.

var myApp = angular.module('myApp',[]); 
function MyCtrl($scope) { 
    $scope.array = ['MON 5 10', ' TUE 6 11']; 
    var data = { 
     headers : [], 
     rows : [] 
    }; 
    var array = $scope.array; 
    for(var index in array){ 
     data['headers'].push(array[index].trim().split(/\s+/)[0]); 
     data['rows'].push(array[index].trim().split(/\s+/).splice(1)) 
    } 

    data['rows'] = data['rows'][0].map(function(col, i) { 
     return data['rows'].map(function(row) { 
     return row[i] 
     }) 
    }); 


    $scope.data = data; 
} 


<div ng-controller="MyCtrl"> 
<div > 
    <span ng-repeat="header in data.headers">{{header}}</span> 
</div> 
<div ng-repeat="row in data.rows"> 
    <div > 
     <span ng-repeat="item in row">{{item}}</span> 
    </div> 
</div> 
</div> 

JS-Fiddle link