如何知道是否有溢出隐藏的子 div：隐藏在 Angular 6 中答案

【问题标题】：How to know if there are child divs hidden by overflow: hidden in Angular6如何知道是否有溢出隐藏的子 div：隐藏在 Angular 6 中
【发布时间】：2019-12-18 20:06:51
【问题描述】：

这是我要解决的问题。

 <div class="row" style="overflow:hidden;">
    <app-car
      *ngFor="let car of cars; trackBy: trackByFunction"
      [car]="car"
    >
    </app-car>
 </div>

 <button> More <button>

如果父项的overflow:hidden属性隐藏了汽车，我想显示更多按钮。

【问题讨论】：

请添加更多描述，以便我可以帮助您
如果汽车数组长度超过特定限制，为什么不启用按钮？
我设置了父 div 最大高度（只显示一排汽车）和溢出：隐藏属性。因此，如果屏幕宽度足以在一行中显示所有汽车，则显示它们，否则隐藏溢出。问题是，如果有汽车被溢出隐藏，我想显示一个“更多”按钮：父 div 的隐藏 css 属性（在小屏幕计算机上会有）。我正在使用角度 6。@Alex
显示更多按钮是做什么的。？
我认为这是更多与 css 相关的查询

标签： javascript jquery css angular

【解决方案1】：

jquery;

$("div").each(function() {
  if($(this).parent().css('overflow') == 'hidden'){
    console.log("there is an overflow hidden");
    }
});

【讨论】：

你正在改变你的问题和标题：D 我的答案现在不起作用，我希望你能找到你的最后一个问题。

【解决方案2】：

你可以在angular6中使用viewChild和ngIf来实现你的情况

<div class="row" style="overflow:auto;height:50px" #container>
<app-car
  *ngFor="let car of cars; trackBy: trackByFunction"
  [car]="car">
</app-car>
 </div>

<button *ngIf="container.style.overflow === 'hidden'"> More <button>

并在您的 ts 文件中包含以下项目

 @ViewChild('container') private container: ElementRef;

【讨论】：