角網格（ag-grid）顯示/隱藏不起作用

Question

我正在使用Angular Grid（ag-grid）顯示數據。 在我的gridOptions中，當單擊其中一列時，我使用cellClicked來調用一個函數。 該功能， SeeDetails只需將范圍內的變量設置為true或false即可隱藏/顯示包含ag-grid的div。 由於某種原因，它不起作用。

為了進行測試，我在ag-grid外部創建了一個按鈕，該按鈕調用了相同的SeeDetails函數。 以這種方式執行操作時，div將網格隱藏得很好（在我的html中，我有ng-show="vm.ShowDetails == 'false'"以顯示隱藏網格）。

我認為這與范圍有關，只是不確定。 有任何想法嗎？

HTML：

<div ng-show="vm.ShowDetails == 'false'">
    <div style="height: 800px" ag-grid="vm.gridOptions" class="ag-fresh"></div>
</div>

視圖模型：

var vm = this;
vm.ShowDetails = 'false';

vm.gridOptions = {
    rowData: null,
    enableColResize: true,
    enableSorting: true,
    enableFilter:  true,
    columnDefs: [
        {
            field: 'LogID',
            headerName: 'Log ID a',
            width: 100
        }, {
            headerName: 'Log ID',
            name: 'Log ID',
            cellClicked: function (params) {
                vm.SeeDetails(params.data.LogID);
            },
            cellRenderer: function (params) {
                return '<a>' + params.data.LogID + '</a>';
            }
        }, {
            headerName: 'Date Of Error',
            name: 'Col Name',
            cellRenderer: function (params) {
                return moment(params.data.TimeOfError).format('DD/MMM/YYYY')
                //return params.data.TimeOfError;
            }
        }
    ]
};

vm.SeeDetails = function SeeDetails(LogID) {
    if (vm.ShowDetails == 'false') {
        vm.ShowDetails = 'true';
    } else {
        vm.ShowDetails = 'false';
    }
}

Answer 1

在此特定回調中，ag-grid不會調用摘要循環。

要解決此問題，只需確保摘要周期已開始。

為此，請執行以下操作：

vm.SeeDetails = function SeeDetails(LogID) {
    if (vm.ShowDetails == 'false') {
        vm.ShowDetails = 'true';
    } else {
        vm.ShowDetails = 'false';
    }
    setTimeout( function() { $scope.$apply(); }, 0 );
}

超時是作為保護措施完成的，以確保摘要循環尚未運行。 需要調用本機超時而不是使用角度超時服務，因為角度之一將保證摘要正在運行（您不希望這樣做）。

Answer 2

$timeout(function() {
     $scope.gridOptions.api.checkGridSize()
});

為我工作。