javascript - 如何使用 $.ajax 成功刷新 ng-repeat

Question

我是 angularjs 的新手。我试图插入一些有关项目的评论。 我使用 jquery ajax 插入评论，并在页面加载时使用 angularjs 绑定(bind)所有评论。我的问题是我可以在 $.ajax 成功后立即刷新或更新 ng-repeated 数据

这是我的jquery

    $("#reviewSubmit").click(function () {
        var reviewData = JSON.stringify({ "Review": $('#txtReview').val() });
        document.cookie = "ScrollPosition=" + $(window).scrollTop();
        $.ajax({
            url: "@Url.Action("MyReview", "ProductDetail")",
            data: reviewData,
            dataType: 'json',
            type: "POST",
            contentType: "application/json;charset=utf-8",
            success: function (data) {
                if (data == true) {
                    alert('Authorized');
                    $("#review_write").hide(250);
                    Test();
                }
                else {
                    var url = "@Url.Action("Login", "Login", new { area = ""})";
                    window.location = url;
                }
            },
            error: function (xhr, ajaxOptions, thrownError) {
                alert(xhr.responseText);
            }
        });
    });
});

这是我的Angular js

app.controller('ReviewModel', function ($scope, UserReviews) {
    getReviews();
    function getReviews() {
        UserReviews.getReviews().
        success(function (data) {
            $scope.Reviews = data;
            console.log($scope.Reviews);
        })
        .error(function (error) {
            $scope.status = 'Unable to load customer data: ' + error.message;
            console.log($scope.status);
        });
    }
})

app.factory('UserReviews', ['$http', function ($http) { 

    var UserReviews = {};

    UserReviews.getReviews = function () {
        var url = appurl + "/ProductDetail/GetUserReview";
        return $http.get(url);
    };

    return UserReviews;
    }]);

这是我的 View

                <div ng-app="myApp">
                    <div id="myElementWithController" ng-controller="ReviewModel">
                        <ul ng-repeat="item in Reviews">
                            <li>{{item.Comment}}</li>
                        </ul>
                    </div>
                </div>

Answer 1

这里是因为您正在从 jQuery 方法更新 scope 变量(在 Angular 上下文之外)。它不运行摘要循环并且绑定(bind)未更新。

使用 $http.post 而不是 $.ajax post 将处理摘要周期。