Question

我有默认数组：

$scope.columns = [
                {
                    field :"id",
                    title : $translate.instant('ID'),
                    width : 250,
                    template: function(dataItem) {
                        switch (dataItem.id)
                        {
                            case null:
                                return "N/A";
                            default:
                                return dataItem.id;
                        }
                    }
                },
                {
                    field :"name",
                    title : $translate.instant('NAME'),
                    width: 250,
                    filterable: {
                        cell: {
                            operator: "contains"
                        }
                    }
                }
     ];

我想在成功回调中将一个新项目推送到此数组中：

.success(function(data, status, headers, config) {
        // successful data retrieval
        console.log("request success, checking state");
        console.log(data);
        // sent status to global HTTP status service
        var jsonResponse = ApiService.processReturnedHttpState(status);
        console.log("Status response is " + jsonResponse.result);
        // do something with data
        switch (jsonResponse.result) {
        case true:
            console.log(data);
            var newColumn =      {
                field :"TEST",
                title : $translate.instant('TEST'),
                width: "auto",
                filterable: {
                    cell: {
                        operator: "contains"
                    }
                },
            };

            $scope.$apply(function () {
                $scope.columns.push(newColumn);
            });

            break;
        case false:
            growlNotifications.add($translate.instant('LIST_LOADING_ERROR'), 'error', $rootScope.notificationLifetime);
            break;
        }
    }).error(function(data, status, headers, config) {
        var jsonResponse = ApiService.processReturnedHttpState(status);
        console.log("Processing error with status " + status);
        growlNotifications.add($translate.instant('PROCESSING_REQUEST_ERROR') + jsonResponse.message, 'error', $rootScope.notificationLifetime);
        // hide loading spinner
        kendo.ui.progress(gridView, false);
    });

我尝试了范围应用和超时功能，但没有运气，新值永远不会添加到新的默认范围。

模板如下：

{{columns}}
<div id="test_grid_wrapper" data-ng-controller="TestCtrl" ng-init="initData()"> 
    <div id="test_grid" ng-if="contentAvailable"  data-ng-controller="TestCtrl" ng-init="initGrid()" >

    </div>
</div>

我该如何解决？

感谢您的任何建议。

Answer 1

您可以尝试：

$scope.$apply(function () {
    $scope.columns.push(newColumn);
});

Answer 2

我认为concat（）适用于两个数组，所以在这里你要做push（）。此外，我将直接访问$ scope：

上的数组

$scope.columns.push(newColumn)

此外，它可能与此问题相关联：Understanding scopes 实际上，你不应该使用一个应该直接在作用域上更改的对象/数组，而应该在另一个对象中使用它：

$scope.myData = {
    columns: [
        {
            field :"id",
            title : $translate.instant('ID'),
            width : 250,
            template: function(dataItem) {
                switch (dataItem.id)
                {
                    case null:
                        return "N/A";
                    default:
                        return dataItem.id;
                }
            }
        },
        {
            field :"name",
            title : $translate.instant('NAME'),
            width: 250,
            filterable: {
                cell: {
                    operator: "contains"
                }
            }
        }
     ]
 };

然后像这样使用它：

{{myData.columns}}

Answer 3

这应该可以正常工作，而不必使用$scope.apply()。当您的异步请求返回时，只需执行以下操作：

$scope.columns.push(newColumn);

这将自动更新您的模板。我已经添加了demo fiddle来演示。

无法将对象从异步成功回调推送到数组范围

3 个答案: