AngularJS - クラスをトグルしていないトグルクラスNGクラスのディレクティブ

Question

指令

scope.pauseClass = 'fa fa-pause'; 
scope.muteClass = 'fa fa-volume-on'; 

<button ng-click="doPlayOrPause(uniqId)"><i ng-class="pauseClass"></i></button> 
<button ng-click="doMute(uniqId)"><i ng-class="muteClass"></i></button> 

scope.doMute = function(){ 
     var vlc = scope.getVLC("vlc"); 
     if (vlc && vlc.playlist.isPlaying) { 
      vlc.audio.toggleMute(); 
      scope.controlClass = 'fa fa-volume-off'; 
     }else{ 
      scope.controlClass = 'fa fa-volume-on'; 
     } 
} 


scope.doPlayOrPause = function(){ 
     var vlc = scope.getVLC("vlc"); 
     if(vlc){ 
      if(vlc.playlist.isPlaying){ 
       vlc.playlist.togglePause(); 
       scope.controlClass = 'fa fa-play'; 
      }else{ 
       vlc.playlist.play(); 
       scope.controlClass = 'fa fa-pause'; 
     } 
    } 
} 

ここ

初めてのクリックを使用して、私は、ng-classが適用され、ミュートアイコンが表示されますが、もう一度それをクリックする参照してください。

1. ng-classディレクティブを使用してクラスを切り替えるにはどうすればよいですか？
2. ng-classディレクティブを使用して複数のクラスに対して1つの関数を適用し、 ng-class = 'whatClassIsIt（call.State）'のように呼び出す方法を教えてください。

Answer 1

質問の入力ミスではない場合は、 'controlClass'の代わりに 'pauseClass'と 'muteClass'の値をコントローラで設定する必要があります。

scope.doMute = function(){ 
     var vlc = scope.getVLC("vlc"); 
     if (vlc && vlc.playlist.isPlaying) { 
      vlc.audio.toggleMute(); 
      scope.muteClass = 'fa fa-volume-off'; 
     }else{ 
      scope.muteClass = 'fa fa-volume-on'; 
     } 
} 


scope.doPlayOrPause = function(){ 
     var vlc = scope.getVLC("vlc"); 
     if(vlc){ 
      if(vlc.playlist.isPlaying){ 
       vlc.playlist.togglePause(); 
       scope.pauseClass = 'fa fa-play'; 
      }else{ 
       vlc.playlist.play(); 
       scope.pauseClass = 'fa fa-pause'; 
     } 
    } 
}