So ändern Sie die Farbe des Etiketts des md-input-container Etiketts nach dem Einfügen eines Textes

Question

Wie ändern Sie die Farbe des md-input-container Etiketts, nachdem es eine bestimmte Eingabe enthält? Ich möchte nicht, dass es grau ist, weil es so aussieht, als wäre es ausgegraut. Zum Beispiel möchte ich die Farbe der Beschriftung "Beschreibung" ändern, nachdem/wenn das Eingabefeld eine Eingabe enthält. Ich habe versucht, md-input-Behälteretikett in css modifiziert durch diesen Code verwenden, aber es funktioniert nicht:

md-input-container.md-default-theme label, 
md-input-container.md-default-theme .md-placeholder { 
    color: #FDFE67 !important; 
} 

Hier ist mein html:

<div ng-app="MyApp" ng-controller="DemoCtrl" layout="column" ng-cloak="" class="md-inline-form inputdemoBasicUsage"> 
    <md-content layout-padding=""> 
    <div> 
     <form name="userForm"> 
     <md-input-container class="md-block"> 
      <label>Input-autofocus</label> 
      <input ng-model="user.firstName" type="text" autofocus> 
     </md-input-container> 

     <md-input-container class="md-block"> 
      <label>Input-md-autofocus</label> 
      <input ng-model="user.title" type="text" md-autofocus> 
     </md-input-container> 
     </form> 
    </div> 
    </md-content> 
</div> 

Hier ist mein Winkel:

angular 
    .module('MyApp', ['ngMaterial', 'ngMessages']) 
    .controller('DemoCtrl', function($scope) { 

    }); 

Hier ist mein Code auf codepen: http://codepen.io/zcook/pen/bpxGWJ

Answer 1

Wenn Sie das Etikett co wollen lour ändern, wenn es Eingang hat Sie verwenden können ...

.md-inline-form md-input-container.md-input-has-value label{ 
    color: red; 
} 

Wenn Sie das Etikett die Farbe ändern möchten, nachdem eine Benutzereingabe eingegeben eine bewegte Fokus verwenden Sie weg ...

.md-inline-form md-input-container.md-input-has-value:not(.md-input-focused) label{ 
color: red; 
}