$scope.$apply 在插入数据时不起作用答案

【问题标题】：$scope.$apply is not working when inserting data$scope.$apply 在插入数据时不起作用
【发布时间】：2018-03-05 05:16:43
【问题描述】：

我想在 http 请求后立即显示新数据而不重新加载整个页面。我发现我可以使用 angularjs 中的$apply 来解决这个问题。但我被困住了。数据不会立即显示。

这是控制器中的代码。

$scope.reload = function(data){
            $timeout(function () {
                $scope.$apply(function () {
                    console.log(data);
                    $scope.data = data;
                });
            });
        };
// This part is not working
$scope.addMilestone = function (){

            $http({
                url: httpUrl + 'api/milestone/add',
                method: 'post',
                data: $.param($scope.formData),
                headers: {'Content-Type': 'application/x-www-form-urlencoded'}
            })
            .then(function (result) {

                $scope.data = result.data;

                $scope.reload($scope.data);

            });
        };
// This part is working
$scope.deleteMilestone = function(id){
            $http.get(httpUrl + 'api/milestone/delete?id=' + rowid).then(function(result){

                if (result.data === 'OK'){                        
                    $http.get(httpUrl + 'api/carts/content').then(function (returns) {
                        $scope.data = returns.data;
                        $scope.reload($scope.data);
                    });

                }
            });
        };

让我感到困惑的是，这种方法适用于删除数据，但不适用于插入新数据。在$scope.deleteMilestone 中，删除的数据会立即从视图中删除。我希望它也适用于$scope.addMilestone

【问题讨论】：

而不是 $scope.reload($scope.data);使用 $route.reload($scope.data);或者只是 $route.reload();
您在插入时不需要重新加载页面，只需 console.log(result.data) 并检查其中的内容
@SudhirOjha 结果相同，不起作用
@Sravan 它返回正确的数据，所以在这种情况下数据没有问题，只是当我将它传递给视图时它没有显示
$scope.data = result.data; 如果正在发送正确的数据，此行本身应该重新加载数据，只需添加一个控制台并将结果发送到答案，

标签： angularjs httprequest

【解决方案1】：

对你写的部分尝试这样它不起作用。

$scope.addMilestone = function (){
      $http.post('api/milestone/add', $scope.formData, {'Content-Type': 'application/x-www-form-urlencoded'})
                         .then(function (result) {

                    $scope.data = result.data;

                    $scope.reload($scope.data);

                });};

【讨论】：

$scope.formData 似乎没有将数据传递到服务器端。帖子数据的值都是false

【解决方案2】：

您的删除工作正常，因为您在 delete 之后调用了 get api，但对于 add，您没有进行 API 调用，因此不会为您重新加载数据。

将您的添加里程碑方法更改为，

$scope.addMilestone = function (){
    $http({
        url: httpUrl + 'api/milestone/add',
        method: 'post',
        data: $.param($scope.formData),
        headers: {'Content-Type': 'application/x-www-form-urlencoded'}
    })
    .then(function (result) {
        if (result){                        
            $http.get(httpUrl + 'api/carts/content').then(function (returns) {
                $scope.data = returns.data;
                $scope.reload($scope.data);
            });

        }

    });
};

【讨论】：

还是没有运气。我在函数内部做了console.log(returns.data)，它正确返回了数据