Question

使用ng-if和md-virtual-repeat似乎打破了md-virtual-repeat的高度计算。 md-virtual-repeat似乎与ng-show一起使用，但是，我在网格块中使用md-virtual-repeat作为网格列表的一部分; ng-show隐藏了网格图块，但图块仍然占据了相同的空间，就好像它没有被隐藏一样。有关解决方法的任何想法吗？

编辑：对不起的解释感到抱歉，我的脑子里更清楚了。请参阅codepen：http://codepen.io/sweatherly/pen/rLYPvE

ng-if="$mdMedia('md')"

问题似乎与md-tabs有关。如果将屏幕大小减小到中等并刷新，则md-list将显示在每个选项卡中。但是，如果从lg屏幕开始并减少到md而不刷新，则不显示行。我添加了一个带有ng-show而不是ng-if的网格图块，用于演示网格图块在隐藏而不是从DOM中删除时如何仍然占据相同的空间。

嵌套在网格图块下的一些元素的高度设置为100％，但是，当发生此问题时，其中许多元素的高度为：0px。似乎在准确设置父亲的身高之前计算身高。我猜测在父母身上设置一个固定的高度可能会解决它，但是，一个固定的高度并不适合所有的屏幕尺寸。

Answer 1

我的目标是CSS中的错误元素。我通过它的id（例如＃tab-content-0，＃tab-content-1等）定位每个md-tab来设置高度。 Ng-如果删除并创建了更多md-tabs，那么新标签会有新的不同ID（例如＃tab-content-2，＃tab-content-3等）。
我找到的解决方案是投射更广泛的网络并使用元素而不是id：

md-tab-content .md-virtual-repeat-container {
  height:calc(100% + 48px);
}
md-tab-content > div {
  height: calc(100%);
}

新的代码：http://codepen.io/sweatherly/pen/pbpKZO

使用ng-if，md-virtual-repeat高度计算问题

1 个答案: