物业高度100％在Angular 7 + Electron 4中不起作用

Question

我有一个组件jobs-table.component.html。高于水平我有弯曲方向：列;

<div class="jobs-table">
 ...
</div>

和style jobs-table.component.css：

:host {
  flex-grow: 1;
}
.jobs-table {
  height: 100%;
}

在Chrome v73和Mozilla v65.0.2高度：100％工作正常。但是在Electron 4和Opera v58中无法正常工作！我看到只有一种方法可以解决这个问题

height: calc(100vh - 15rem);

还有其他方法可以解决这个问题吗？代码在这里https://stackblitz.com/edit/angular-pkipxs谢谢提前

Answer 1

我解决了我的问题。我用height: 1px;作为父母。并且height: 100%;现在为孩子运作良好。我认为在我的情况下flex-grow: 1;有与min-height: 100%;相同的行为，这就是为什么height: 1px;帮助我解决我的问题。

:host {
  flex-grow: 1;
  height: 1px; /* Required to make the child 100% of the flex-grow: 1 */
}
.jobs-table {
  height: 100%;
}