Question

所以我现在正试图动态创建手风琴，扩展到包含一些数据的ui网格。问题是，如果我在页面加载的几秒钟内没有扩展手风琴，则ui-grid是空白的。表应存在的大纲但没有显示数据。我说显示是因为数据本身在html中。它似乎被手风琴隐藏了？当我调整浏览器窗口的大小时，会显示数据。对不起，如果这个不够详细，或者我错过了明显的调试步骤，我是js / angular和html的新手。以下是我的HTML代码

# common cocoapods stuff here

abstract_target 'CommonPods' do

  # some other pods here 

  target 'App' do
    pod 'BaseSDK'
  end

  target 'AppPro' do  
    pod 'ProSDK'
  end
end

和我的角度

<div ng-controller="TestController as test">
    <script type="text/ng-template" id="group-template.html">
        <div class="panel-heading">
            <h4 class="panel-title" style="color:#fa39c3">
                <a href tabindex="0" class="accordion-toggle" ng-click="toggleOpen()" uib-accordion-transclude="heading">
                    <span uib-accordion-header ng-class="{'text-muted': isDisabled}">
                        TEST
                    </span>
                </a>
            </h4>
        </div>
        <div class="panel-collapse collapse" uib-collapse="!isOpen">
            <div class="panel-body" style="text-align: right" ng-transclude></div>
        </div>
    </script>
    <uib-accordion close-others="oneAtATime">
        <div ng-repeat="model in myData" track by $index>
            <div uib-accordion-group class="panel-default" is-open="isOpen">
                <uib-accordion-heading>
                    Test Model {{$index}} <i class="pull-right glyphicon" ng-class="{'glyphicon-chevron-down': isOpen, 'glyphicon-chevron-right': !isOpen}"></i>
                </uib-accordion-heading>
                <div id="grid[$index]" ui-grid="gridOptions[$index]" ui-grid-edit class="grid" style="clear:both"></div>
                <br />
                <strong>Last Cell Edited:</strong>{{msg[$index]}}<br />
                <button>Commit Changes</button>
            </div>
        </div>
    </uib-accordion>

}）（）;

Answer 1

我会抓住这个并说你可能想要在ui-grid中添加ng-if="isOpen"。所以下面的内容应该可以解决你的问题。

 <div id="grid[$index]" ui-grid="gridOptions[$index]" ui-grid-edit class="grid" style="clear:both" ng-if="isOpen"></div>

我的网格显示也出现问题，并确保网格仅在绝对准备好时才会出现问题。 ui-grid文档在http://ui-grid.info/docs/#/tutorial/108_hidden_grids处讨论了隐藏网格的概念。他们还有一个你可以在http://plnkr.co/edit/LtpFnDUTofuxitb4Vh9x?p=preview跟随的plnkr。我希望这有帮助！

在页面加载几秒钟后打开引导手风琴时，ui-grid是空白的？

1 个答案: