Question

我有一个非常简单的ng-if构造，它使用两个MD按钮和一个AngularJS范围变量isPlaying。但是，ng-if似乎与变量一起工作。我可以看到变量随着我点击按钮而变化，使用控制台工具，但是没有对DOM进行任何更改。奇怪的是，当我悬停其他Angular组件时，ng-if似乎会触发，例如主导航中的按钮。

HTML / MD / PHP：

<md-button class="md-icon-button" ng-if="!isPlaying" ng-click="play()" aria-label="Play">
    <md-icon md-svg-src="<?php echo get_stylesheet_directory_uri(); ?>/img/icon/ic_play_arrow_black_24px.svg"></md-icon>
</md-button>
<md-button class="md-icon-button" ng-if="isPlaying" ng-click="pause()" aria-label="Pause">
    <md-icon md-svg-src="<?php echo get_stylesheet_directory_uri(); ?>/img/icon/ic_pause_black_24px.svg"></md-icon>
</md-button>

JS：

$scope.play = function () {
    player.playVideo();
    $scope.isPlaying = true;
}

$scope.pause = function () {
    player.pauseVideo();
    $scope.isPlaying = false;
}

Answer 1

问题是由包含在超时块内的函数引起的。我将setTimeout替换为$timeout，一切正常：

$scope.isPlaying = false;
$scope.videoTime = 0;
function onPlayerStateChange() {
    console.log(player);
    if (player.getPlayerState() === 1)
        $scope.isPlaying = true;
    else
        $scope.isPlaying = false;
    $timeout(onPlayerStateChange, 500);
}

ngIf不用变量更新

1 个答案: