AngularJS: Wiederholen und Filtern nach Zahlenbereich

Ich versuche ein 'Score' System zu formatieren. Was mein json kehrt ein ‚Titel‘ und eine ‚Partitur‘ - im Idealfall würde ich es so etwas zu formatieren mag:AngularJS: Wiederholen und Filtern nach Zahlenbereich

100 --------

Titel - 99

Titel - 91

90 --------

Titel - 89

Titel - 81

80 -------- (etc usw.)

Ich habe es so gemacht, dass meine Punktzahl in der Reihenfolge vom höchsten zum niedrigsten ist, aber ich weiß nicht, wie man die Bereiche filtert und irgendwie in einen schleicht zusätzliche Tabellenzeile für die Hauptzählbereiche "100, 90, 80".

HTML-Code:

<body ng-app="myApp" ng-controller="myCtrl"> 

<table class="table"> 
<tbody> 
    <tr ng-repeat="x in myData | orderBy:'title' | orderBy:'-score'"> 
    <td>{{x.title}}</td> 
    <td>{{x.score}}</td> 
    </tr> 
</tbody> 
</table> 
</body>

AngularJS:

var app = angular.module('myApp', []); 

app.controller('myCtrl', function($scope, $http) { 
    $http.get("scores.json").then(function (response) { 
    $scope.myData = response.data; 
}); 
});

Ich dachte, vielleicht eine for-Schleife oder if-Anweisung funktionieren würde, aber ich bin nicht sicher, wie das Optionen/Filter in AngularJS die passen

usw.

Quelle

2016-08-04 rebel84

In Ihrem ngrepeat können Sie ein ngif haben, das prüft, ob $ index durch 10 teilbar ist – ksav

ich dies erreicht haben, ohne jeden Filter condition.but Anwendung Ich habe Ihr JSON-Format leicht geändert. Schau hier mein Spiel an.

JsFiddle

und hier ist mein Code

Script

var myApp = angular.module('Application', []); 

myApp.controller('myController', ['$scope', function($scope) { 
    $scope.tabledata = [{ 
     title:"100",subhead:[{value:"99"},{value:"98"},{value:"97"}] 
    }, { 
     title:"90",subhead:[{value:"89"},{value:"88"},{value:"87"}] 
    }, { 
     title:"80",subhead:[{value:"79"},{value:"78"},{value:"77"}] 
    }, { 
     title:"70",subhead:[{value:"69"},{value:"68"},{value:"67"}] 
    }];  

}]);

HTML

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js"></script> 

<div ng-app="Application" ng-controller="myController"> 
    {{ tabledata }} 
    <hr> 
    <div ng-repeat="data in tabledata"> 
     <div id="data.title" class="title"> 
     {{data.title}} 
     </div> 
     <div ng-repeat="subHeading in data.subhead" class="subhead"> 
     {{subHeading.value}} 
     </div> 
    </div> 

</div>

CSS

.title 
{ 
    background-color:#ccc; 
    font-weight:bold; 
    font-size:24px; 
    widht:100%; 
    height:auto; 

} 
.subhead{ 
    background-color:#d7d7d7; 
    font-size:18px; 
    widht:100%; 
    height:auto; 
}

Quelle

2016-08-04 07:32:48 Aryan

können Sie verwenden die modulo operation

Ihre HTML

<body ng-app="myApp" ng-controller="myCtrl"> 

    <table class="table"> 
    <tbody> 
     <tr ng-repeat-start="x in myData | orderBy:'title' | orderBy:'-score'" ng-if="x.score % 10 == 0"> 
     <td colspan="2">x.score -----------</td> 
     </tr> 
     <tr ng-repeat-end> 
     <td>{{x.title}}</td> 
     <td>{{x.score}}</td> 
     </tr> 
    </tbody> 
    </table> 
</body>

Wenn Sie Ihre Gäste ein Vielfaches von 10 ist, wird es einen Abschnitt Titel angezeigt werden, dann wird es den Titel und die Punktzahl angezeigt

Quelle

2016-08-04 07:21:21 Weedoze

AngularJS: Wiederholen und Filtern nach Zahlenbereich

Antwort

Verwandte Themen