2
私はデザインフレームワークとして角度のある素材を使用しています。私は自分のウェブサイトのフォームフィールドのプロトタイプを作成しています。フォームフィールドにはアイコンがあります。フォームフィールドを選択すると、アイコンが選択されたことを示すアイコンの色が変わります。アンギュラマテリアルの2つのフォームフィールドにアイコンを適用するにはどうすればよいですか？
私の質問は、私は2つのフィールドが並んでいて、どちらもアイコンに対応しています。私は、同じユーザアイコンを指す名字フィールドを持っています。
ファーストネームフィールドを選択すると、アイコンが青色に変わります。 姓フィールドを選択すると、アイコンはグレーのままです。 See Screenshot 姓のフィールドを選択してユーザーアイコンも青色に変わるようにするにはどうすればよいですか？
<html>
<head>
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/angular-material/1.0.8/angular-material.css">
<link rel="stylesheet" href="//fonts.googleapis.com/icon?family=Material+Icons">
</head>
<body ng-app="StyleApp">
<div class="group-fields" layout="column" layout-gt-sm="row" layout-md="row">
<md-input-container class="md-icon-float" layout="row" flex-gt-sm>
<label>First Name</label>
<md-icon class="material-icons md-18 color-txt-gray">person</md-icon>
<input ng-model="user.firstname">
</md-input-container>
<md-input-container class="" flex-gt-sm>
<label>Last Name</label>
<input ng-model="user.lastname">
</md-input-container>
</div>
<script src="//cdnjs.cloudflare.com/ajax/libs/angular-material/1.0.8/angular-material.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular-aria.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular-animate.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<script>
angular.module('StyleApp', ['ngMaterial']);
</script>
</body>
</html>