Discussion :

[moonshine34]

Bonjour a tous,

Je suis un amateur pur et dur en angular, mais je souhaite malgré tout me former, aussi désolé pour les fautes de vocabulaire techniques.

je souhaiterai surligner une ligne d'un tableau en gris lorsqu'un élément est un élément par défaut.
Je pensais qu'utiliser la directive md-colors semblait une bonne option mais après avoir vu la doc d'angular je ne vois pas trop comment m'en servir.

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
<tbody md-body>
        <tr md-row ng-repeat="extraCategory in extraCategories">
            <td md-cell>{{extraCategory.id}}</td>
            <td md-cell>{{extraCategory.name}}</td>
          <td md-colors="RED" md-cell>{{extraCategory.isDefault}}</td>
            <td md-cell>
                <md-button class="md-icon-button" ui-sref="extracategory({id: {{extraCategory.id}}})" title="{{ 'ACTION.SHOW.EXTRA-CATEGORY' | translate }}" aria-label="{{ 'ACTION.SHOW.EXTRA-CATEGORY' | translate }}">
                    <md-icon class="material-icons"> exit_to_app </md-icon>
                </md-button>
            </td>
        </tr>
</tbody>

Comme vous pouvez le voir sur le code, j'ai une ligne

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

<td md-colors="RED" md-cell>{{extraCategory.isDefault}}</td>

qui utilise md-colors en Rouge avec ma catégorie qui dispose une valeur isDefault.

Sinon dois-je passer par du javascript ? ajouter une classe qui surligne la ligne désirée en gris si "extraCategory.isDefault=true" ?

D'avance merci pour vos réponses.

[NoSmoking]

Bonjour,
pour la mise en oeuvre regarde la documentation : Directives > md-colors.

[moonshine34]

Salut et merci pour ta réponse !

effectivement, après avoir continué a cherché voici la ligne de code que je sort :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<td ng-if="extraCategory.isDefault == true" md-colors="{color:'RED'}" md-cell>{{extraCategory.isDefault}}</td>

Je souhaiterai modifier un peu ma demande d'origine et voir si il est possible de remonter l'element extraCategory.isDefault == true en tete de liste ?
Des idées ?

[NoSmoking]

Je souhaiterai modifier un peu ma demande d'origine...

	Il est préférable d'ouvrir une discussion par question afin de ne pas perdre le fil de la discussion et de laissez la possibilité aux visiteurs de bénéficier des réponses en leur offrant un sujet moins dispersé.

PS : ne pas oublier de passer cette discussion en résolue

[moonshine34]

D'accord, je reste sur ma demande d'origine alors

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
<tr md-row ng-repeat="extraCategory in extraCategories" ng-if="extraCategory.isDefault == true" md-colors="{background-color:'grey'}">
            <td md-cell>{{extraCategory.id}}</td>
            <td md-cell>{{extraCategory.name}}</td>
            <td md-cell>{{extraCategory.isDefault}}</td>
            <td md-cell>
                <md-button class="md-icon-button" ui-sref="extracategory({id: {{extraCategory.id}}})" title="{{ 'ACTION.SHOW.EXTRA-CATEGORY' | translate }}" aria-label="{{ 'ACTION.SHOW.EXTRA-CATEGORY' | translate }}">
                    <md-icon class="material-icons"> exit_to_app </md-icon>
                </md-button>
            </td>
        </tr>

j'ai ajouté un NGIF sur cette ligne

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

<tr md-row ng-repeat="extraCategory in extraCategories" ng-if="extraCategory.isDefault == true" md-colors="{background-color:'grey'}">

Mais il n'y a que la ligne qui possède l'element "isDefault" qui s'affiche...
Vous auriez une idée afin de d'afficher toutes les lignes du tableau + la ligne défaults en gris ?

Merci encore

[moonshine34]

Je me réponds a moi meme

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

<tr ng-style="extraCategory.isDefault && {'background-color':'gray'}" md-row ng-repeat="extraCategory in extraCategories">

Voila