Comment définir la couleur du texte dans Angulaires-le Matériel?

J'étais juste capable de faire cela en utilisant Angulaire Matériel 1.1.0.

Vous utilisez le md-colors directive similaire à la façon dont vous le feriez ng-class:

<span md-colors="{color:'primary'}">...</span>

Le code ci-dessus la couleur du texte, la couleur primaire. L'objet que vous passez à md-colors utilise la clé comme la propriété css (c'est à dire "couleur", "arrière-plan", etc) et de la valeur que le thème et/ou de la palette et/ou de la teinte que vous souhaitez utiliser.

Source Docs

ÉDITÉ 2015/07/23

TitForTat commentaire a une meilleure solution
https://github.com/angular/material/issues/1269#issuecomment-121303016

J'ai créé un module:

(function () {
        "use strict";
        angular
            .module('custiom.material', ['material.core'])
            .directive('cMdThemeFg', ["$mdTheming", function ($mdTheming) {
                return {
                    restrict: 'A',
                    link: postLink
                };
                function postLink(scope, element, attr) {
                    $mdTheming(element);
                    element.addClass('c-md-fg');
                }

            }])
            .directive('cMdThemeBg', ["$mdTheming", function ($mdTheming) {
                return {
                    restrict: 'A',
                    link: postLink
                };
                function postLink(scope, element, attr) {
                    $mdTheming(element);
                    element.addClass('c-md-bg');
                }
            }]);
    })();

puis ajouter

.c-md-fg.md-THEME_NAME-theme.md-primary {    color: '{{primary-color}}'; }
.c-md-fg.md-THEME_NAME-theme.md-accent {    color: '{{accent-color}}'; } 
.c-md-fg.md-THEME_NAME-theme.md-warn {    color: '{{warn-color}}'; } 
.c-md-bg.md-THEME_NAME-theme.md-primary {    background-color: '{{primary-color}}'; } 
.c-md-bg.md-THEME_NAME-theme.md-accent {    background-color: '{{accent-color}}'; } 
.c-md-bg.md-THEME_NAME-theme.md-warn {    background-color: '{{warn-color}}'; }

en angular-material.js au 13783 ligne

angular.module("material.core").constant("......  HERE")

Ensuite, il me suffit d'appliquer c-md-thème-fg et/ou c-md-thème-bg à l'élément pour appliquer le thème des couleurs. Comme ceci:

<div c-md-theme-bg class="md-primary md-hue-3">dasdasdasd</div>
<span c-md-theme-bg class="md-primary">test</span>

Il fonctionne.

ps: désolé pour l'anglais, venu de Taiwan 🙂

La latests bits apporter de bonnes nouvelles à ce sujet... Cette fonctionnalité a été ajoutée à la version 1.1.0-rc3 (2016-04-13) version. Il n'est pas stable, mais mes premiers essais sont satisfaisants.

Maintenant, vous pouvez utiliser le mdColors directive et $mdColors service en conjonction avec les thèmes d'obtenir ce que vous cherchez.

S'il vous plaît, jetez un oeil à:

https://github.com/angular/material/blob/master/CHANGELOG.md#110-rc3-2016-04-13

pour voir l'annonce, et de regarder pour la mdColor directive et $mdColor service dans les docs pour quelques exemples.

Élément d'ancrage () réagit à l'angle de Matériel de thème en cours de réglage depuis version 1.0.0-rc1: https://github.com/angular/material/blob/master/CHANGELOG.md#110-rc1-2016-03-09.

Pour moi, je suppose que tout ce qui commence par md - vous ne pouvez appliquer le thème des couleurs.

Dans la documentation il y a des composants qui ne sont pas documentés où vous pouvez utiliser des couleurs de thème.
Exemple:

<md-subheader class="md-warn"> my subheader </md-subheader>
<md-icon class="md-accent"> </md-icon>