Javascript 更改播放/停止按钮angularjs

我正在尝试做一个基本的播放停止控制

当我点击播放按钮时，我希望它变为停止按钮。维切维萨。这段代码正在运行，但刷新得很糟糕。停止按钮显示在播放按钮隐藏之前。维切维萨。有什么想法吗

在html中

<div style="margin-top: 1%;margin-left: 10%">

<button class="media-object button-icon ion-ios-play botonesPlayStop" ng-show="playVisible"
ng-click="btnReproducirAudio()"></button>

<button class="media-object button-icon ion-stop botonesPlayStop" ng-hide="playVisible"
ng-click="detenerAudio()"></button>

---

使用

ng show

或

ng hide

更新视图会有一点延迟。使用

ng if

（也适用于DOM）总是更好

另一种可能更好但也不多的方式：

HTML:

var ruta= "/android_asset/www/sounds/beep.amr";
$scope.audiofile = new Media(ruta);

$scope.detenerAudio = function () {
        $scope.audiofile.stop();
        $scope.playVisible=true;

};

$scope.btnReproducirAudio() {
        $scope.audiofile.play();
        $scope.playVisible=false;
}

<button class="media-object button-icon botonesPlayStop" ng-class"{'ion-ios-play': playVisible, 'ion-stop': !playVisible}" ng-click="playOrStop()"></button>

$scope.playOrStop = function () {
    if($scope.playVisible){
       $scope.audiofile.play();
    }else{
       $scope.audiofile.stop();
    }

    $scope.playVisible = !$scope.playVisible;
};