Dodawanie klasy do wiersza ng-grid

Używam ng-grid do wyświetlania kolekcji plików, które są przesyłane (każdy plik ma swój własny wiersz).Dodawanie klasy do wiersza ng-grid

Jeśli jeden z plików nie zostanie przesłany, chciałbym zmodyfikować ten wiersz i umieścić na nim klasę, aby pokazać, że nie udało się go przesłać.

Jak mogę dodać klasę do całego wiersza?

Źródło

2013-10-29 robert.bo.roth

może ustawić własne szablony ... następnie w zestawie szablonów 'ng-class' w oparciu o dowolną zmienną, której potrzebujesz do momitor. Zobacz dokumentację linku do wiki Githuba dotyczącego szablonów. – charlietfl

Ah, dzięki kolego. Przeglądałem dokumenty przez jakieś 30 minut, nie jestem pewien, jak przegapiłem opcję konfiguracyjną 'rowTemplate'. –

Musisz użyć szablonu wiersza. W tym szablonie można użyć ng-class i dynamicznie przypisać klasę CSS przez wiązanie danych.

Prosty przykład:

HTML

<body ng-controller="MyCtrl"> 
    <div class="grid" ng-grid="gridOptions"></div> 
</body>

JavaScript

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

app.controller('MyCtrl', function($scope) { 
    $scope.fileOneUploaded = true; 
    $scope.fileTwoUploaded = false; 

    $scope.gridData = [{fileName: 'File 1', size: 1000, isUploaded: $scope.fileOneUploaded }, 
       {fileName: 'File 2', size: 2000, isUploaded: $scope.fileTwoUploaded }]; 
    $scope.gridOptions = { 
    data: 'gridData', 
    rowTemplate: '<div style="height: 100%" ng-class="{red: !row.getProperty(\'isUploaded\')}">' + 
        '<div ng-repeat="col in renderedColumns" ng-class="col.colIndex()" class="ngCell ">' + 
         '<div ng-cell></div>' + 
        '</div>' + 
       '</div>' 

    } 
});

CSS

.grid { 
    width: 300px; 
    height: 100px; 
    border: solid 1px rgb(90,90,90); 
} 

.red { 
    background-color: red; 
    color: white; 
}

Źródło

2013-10-29 21:38:01 pmoule

Dzięki za napisanie odpowiedzi. Dziś dowiedziałem się, że nie umiem czytać. Czytałem przez docs, próbując znaleźć rowTemplate i po prostu go brakowało :) Jeszcze raz dziękuję. –

Jestem głupi. Dostępna jest standardowa opcja konfiguracji, mianowicie rowTemplate.

Dzięki @charlieftl za uczynienie mnie ponownie przeczytać docs :)

Źródło

2013-10-29 20:43:45

Dodawanie klasy do wiersza ng-grid

Odpowiedz

Powiązane problemy