Angular.js - $ scope不從setTimeout（）更新

Question

我的想法是，我在加載數據時顯示加載的.gif文件，然后在加載所有數據后，等待x個時間，當前為3000毫秒，但是會降低，然后在給定的時間后，設置data.show的值為true，因此加載的.gif不再顯示而且表格是。

所以，我怎么引用show在HTML，NG-顯示從JavaScript的？

任何幫助，將不勝感激！

謝謝 ：）

編輯：這適用於此回答 - setTimeout v $ timeout

HTML

 <div ng-show="!show">
    <img id="loader" src="resources/ajax-loader.gif">
</div>

<div ng-show="show">
    <div class="ui grid center aligned">
        <div class="column thirteen wide">
            <table id="errorTable" class="ui compact celled definition table">
                <p>Stuff</p>
            </table>
        </div>
    </div>
</div>

JavaScript的

function onSuccess(response) {
    controller.errors = response.data;
    setTimeout(function () {
        $('#errorTable').DataTable({
            "lengthMenu": [[6], [6]],
            "dom": '<"toolbar">frtip'
        });
        $("div.toolbar").html('<div class="ui input left floated"><input type="text" placeholder="Search..."></div>');
        $scope.show = true;
    }, 3000);
}

Answer 1

問題是你沒有在開頭定義$ scope.show。 您可能不需要show.data。 請在控制器的開頭添加以下行

$scope.show = false;

並將html更改為：

 <div ng-show="!show">
    <img id="loader" src="resources/ajax-loader.gif">
</div>

<div ng-show="show">
    <div class="ui grid center aligned">
        <div class="column thirteen wide">
            <table id="errorTable" class="ui compact celled definition table">
                <p>Stuff</p>
            </table>
        </div>
    </div>
</div>

在控制器中：

您已經在setTimeout外添加了$ scope.show.data，根據需要將其添加到setTimeout函數中並添加：

function onSuccess(response) {
    controller.errors = response.data;
    $timeout(function () {
        $('#errorTable').DataTable({
            "lengthMenu": [[6], [6]],
            "dom": '<"toolbar">frtip'
        });
        $("div.toolbar").html('<div class="ui input left floated"><input type="text" placeholder="Search..."></div>');
        $scope.show = true;
    }, 3000);
}

這是我試過的那個傻瓜

Answer 2

嘗試添加$scope.show = { data: false }; 在控制器中

Answer 3

因為沒有div.toolbar ，意思是， $('div.toolbar')將為null/undefined ，這導致該語句處的空指針並且下一個語句未被執行，因為執行在之前已經停止。

簡單的解決方案可能是放置$scope.show.data = true; 作為setTimeout調用的function的第一個語句。