如何根据输入隐藏和显示带有列的UI网格

Question

我正在使用Angular UI Grid。我想显示基于复选框输入的UI网格。我能够根据复选框隐藏和显示网格，但无法在UI网格中显示列。

HTML代码

<table>
   <tr>
    <td valign="top">
         <label>Recursive</label>
    </td>
   </tr>
   <tr>
    <td valign="top">
          <input type="checkbox" ng-model="eventadd.md_eventrecursive"
                 ng-true-value="true" ng-false-value="false">
    </td>
   </tr>
</table>
<br/>
<div ng-show="eventadd.md_eventrecursive">
   <div ui-grid="gridRecursiveEvent" class="gridSmallStyle"></div>
</div>

JS代码

$scope.gridRecursiveEvent = {
    columnDefs: [
        {
            field: 'Name', displayName: 'Name'
        },
        {
            field: 'Id', displayName: 'Id',
        },
    ],
}

选中“递归”事件后，它将显示“网格”但没有列

需要您的帮助。

Answer 1

请参阅this page。

问题是首先不渲染网格（因为它是隐藏的）。选中该复选框不会呈现ui-grid。

请参阅文档，了解适合您需求的可能解决方法。