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 지시문을 사용하여 여러 클래스에 하나의 함수를 적용하고 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'; 
     } 
    } 
}