Question

我正在使用 Ag Grid v11.0 angular 1.x 。渲染网格后，我想做一个动作（例如：保存网格项）更改 overlayLoadingTemplate 属性以显示不同的消息（例如：保存...请稍候）。

$scope.save = save;

var _overlayLoadingTemplate = '<span class="ag-overlay-loading-center">Please wait while your items are loading</span>';
var _overlaySaveTemplate = '<span class="ag-overlay-loading-center">Saving...</span>';

$scope.gridOptions = {
  columnDefs: columnDefs,
  rowData: [/*stuff*/],
  overlayLoadingTemplate: _overlayLoadingTemplate,
};

function save () {
  $scope.gridOptions.overlayLoadingTemplate = _overlaySaveTemplate;

  $scope.gridOptions.api.showLoadingOverlay();

  /* call service and get response logic here */

  $scope.gridOptions.api.hideOverlay();
}

overlayLoadingTemplate 属性未被更改，是最初的属性：_overlayLoadingTemplate。我没有找到任何设置方法，如 setOverlayLoadingTemplate

Answer 1

无法以您想要的方式更新叠加层。加载覆盖和无行覆盖可以从默认值更改，但这是在初始化时完成的，不能再次更改。

如果您希望显示特定于应用程序的叠加层，我担心您需要自己提供此实现。

Answer 2

有可能。在主从方案中，我需要更改子网格的覆盖模板中的文本。

在叠加模板中，创建占位符元素，并在调用showLoadingOverlay

之前将其与内容交换

$scope.save = save;

var _overlayLoadingTemplate = '<span class="ag-overlay-loading-center"><span id="js-overlay-text">Please wait while your items are loading...</span></span>';

$scope.gridOptions = {
  columnDefs: columnDefs,
  rowData: [/*stuff*/],
  overlayLoadingTemplate: _overlayLoadingTemplate,
};

function save () {

  document.getElementById("js-overlay-text").innerText = "Saving...";
  $scope.gridOptions.api.showLoadingOverlay();

  /* call service and get response logic here */

  $scope.gridOptions.api.hideOverlay();
}

如何更改ag Grid中的overlayLoadingTemplate？

2 个答案: