AngularJS filter table

Filtrovanie tabuľky.

Filtrovanie tabuľky podľa viacerých stĺpcov naraz.

Filter:

MCU Flash RAM EEPROM
{{x.name}} {{x.flash}} kB {{x.ram}} B {{x.eeprom}} B

script

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

filter-table.html

<div ng-app="myApp" ng-controller="myCtrl">
    <p>Filter: <input class="form-control" type="text" ng-model="flt.$" placeholder="Vložte text" ></p>
    <table class="table">
        <tr>
            <th>MCU</th>
            <th class="text-right">Flash</th>
            <th class="text-right">RAM</th>
            <th class="text-right">EEPROM</th>
        </tr>
        <tr ng-repeat="x in mcu | filter: flt | orderBy: 'name'">
            <td>{{x.name}}</td>
            <td class="text-right">{{x.flash}} kB</td>
            <td class="text-right">{{x.ram}} B</td>
            <td class="text-right">{{x.eeprom}} B</td>
        </tr>
    </table>

</div>

filter-table.js

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

app.controller('myCtrl', ['$scope', '$window', function($scope, $window) {

    $scope.mcu = [
        {name: 'ATmega328P', flash: 32, ram: 2048, eeprom: 1024},
        {name: 'ATtiny85', flash: 8, ram: 512, eeprom: 512},
        {name: 'ATtiny13A', flash: 1, ram: 64, eeprom: 64},
        {name: 'ATmega2560', flash: 256, ram: 8*1024, eeprom: 4096},
    ];
}]);

Aplikácie

Menu