角度的UI - 隐藏后不刷新

Question

我期待隐藏标签，然后显示它们，但我面临一个令人耳目一新的问题。 实际上，如果我选择一个图表，然后单击隐藏按钮以显示网格，它会隐藏其他选项卡，但它始终显示nvD3图表而不是ui网格。即使在图表标签中，如果我选择标签2，然后点击隐藏按钮，然后显示按钮，它将激活第一个标签，但第二个图表不是第一个标签。

<uib-tabset> 
<uib-tab heading="Test1" ng-hide=hideCharts> 
    <nvd3 options="options" data="data"></nvd3> 
</uib-tab> 
<uib-tab heading="Test2" ng-hide=hideCharts> 
    <nvd3 options="options" data="data1"></nvd3> 
</uib-tab> 
<uib-tab heading="Test3" ng-hide=hideCharts> 
    <nvd3 options="options" data="data2"></nvd3> 
</uib-tab> 
<uib-tab heading="Test4"> 
    <div id="grid1" ui-grid="gridOptions" ui-grid-grouping class="grid"></div> 
</uib-tab> 
</uib-tabset> 

这里是我想要

Answer 1

NG隐藏不会删除的选项卡组件，这将导致其状态仍然被跟踪的例子中plunker。 我修正了使用ng-if而不是ng-id。 这里是一个plunker与解决方案

<uib-tabset> 
<uib-tab heading="Test1" ng-if=hideCharts index="1"> 
    <nvd3 options="options" data="data"></nvd3> 
</uib-tab> 
<uib-tab heading="Test2" ng-if=hideCharts index="2"> 
    <nvd3 options="options" data="data1"></nvd3> 
</uib-tab> 
<uib-tab heading="Test3" ng-if=hideCharts index="3"> 
    <nvd3 options="options" data="data2"></nvd3> 
</uib-tab> 
<uib-tab heading="Test4"> 
    <div id="grid1" ui-grid="gridOptions" ui-grid-grouping class="grid"></div> 
</uib-tab> 
</uib-tabset>