Angular.js-ng-repeat不顯示更新的數組

Question

當我使用AJAX請求時，我得到的代碼可以完美地從數組中讀取數據。 但是，當我將對象推送到數組時，ng-repeat不會渲染新行，因此我必須刷新頁面才能獲取發送到服務器的數據。

為什么這樣做呢？ 謝謝

使用Javascript

function processError() {
        var responseCode = 404;
        var error = {};
        error["client"] = document.getElementById('client').value;
        error["errorMessage"] = document.getElementById('error-message').value;
        error["simpleRes"] = document.getElementById('simple-fix').value;
        error["fullRes"] = document.getElementById('full-fix').value;
        error["reason"] = document.getElementById('reason').value;

        var errorJson = JSON.stringify(error);

        $.ajax({
            url: "../ErrorChecker/rest/error",
            type: "POST",
            data: errorJson,
            contentType: "application/json"
        })
            .done(function (data, statusText, xhr, displayMessage) {
                $('.form').hide();
                responseCode = xhr.status;
                reloadData(data);
            });

        function reloadData(data) {
            if (responseCode == 200) {
                processPositiveResponse(data);
            } else {
                $('#negative-message').show(1000);
            }
        }
    }

function processPositiveResponse(data) {
        $('#positive-message').show(1000);
        updateTable(data);
        $('#errorTable').DataTable().destroy();
        setupTable();
        clearInputs();
        console.log($scope.controller.errors);
    }

function updateTable(data) {
        $scope.controller.errors.push({
            "id": data,
            "client": document.getElementById('client').value,
            "errorMessage": document.getElementById('error-message').value,
            "simpleRes": document.getElementById('simple-fix').value,
            "fullRes": document.getElementById('full-fix').value,
            "reason": document.getElementById('reason').value
        })
    }

HTML

<tbody>
    <tr ng-repeat="x in dataCtrl.errors">
        <td class="collapsing">
            <div class="ui toggle checkbox">
                <input type="checkbox">
                <label></label>
            </div>
        </td>
        <td style="display: none">{{ x.id }}</td>
        <td>{{ x.client }}</td>
        <td>{{ x.errorMessage }}</td>
        <td>{{ x.simpleRes }}</td>
        <td>{{ x.fullRes }}</td>
        <td>{{ x.reason }}</td>
    </tr>
</tbody>

Answer 1

那是因為您同時使用jQuery和Angular。 不要那樣做 EVER。 Angular不知道jQuery在做什么，而jQuery不知道Angular在DOM中正在生成什么。 解決方案：刪除jQuery並使用Angular自己的$http服務。

以同樣的方式，不要使用document.getElementById('full-fix').value 。 您正在向后傾斜Angular。 Angular從數據生成 DOM，因此您無需選擇 DOM元素即可讀取其值，因為該值已存在於數據中。

Answer 2

更新文檔。 使用范圍適用於快速修復。 不是imo的方式。 但這將快速解決您的問題。 如果我不忘記自己的手機，請稍后再更新此評論，以獲取更多詳細信息和最佳實踐。 目前，適用范圍的Google搜索將對您有很大幫助。