在angular 2+中高度为0的元素上的scrollIntoView

在Angular 2+中，scrollIntoView()方法用于将指定元素滚动到可见区域。当元素的高度为0时，即元素不可见或隐藏时，调用scrollIntoView()方法将无法滚动到该元素。

要解决这个问题，可以通过以下步骤来实现在高度为0的元素上使用scrollIntoView()方法：

1. 确保元素在调用scrollIntoView()方法之前已经可见或显示出来。可以通过修改元素的CSS样式或使用Angular的*ngIf指令来控制元素的显示与隐藏。
2. 在元素可见后，使用ViewChild装饰器来获取对该元素的引用。在组件类中，使用@ViewChild装饰器来获取元素的引用，然后在代码中使用该引用来调用scrollIntoView()方法。

下面是一个示例代码：

在组件的HTML模板中：

<div #myElement [hidden]="isHidden">
  <!-- 元素内容 -->
</div>

在组件的代码中：

import { Component, ViewChild, ElementRef } from '@angular/core';

@Component({
  selector: 'app-my-component',
  templateUrl: './my-component.component.html',
  styleUrls: ['./my-component.component.css']
})
export class MyComponent {
  @ViewChild('myElement') myElement: ElementRef;
  isHidden: boolean = true;

  scrollToElement() {
    this.isHidden = false; // 显示元素
    this.myElement.nativeElement.scrollIntoView({ behavior: 'smooth' });
  }
}

在上面的示例中，我们使用了一个名为myElement的模板引用变量来获取对元素的引用。然后，在scrollToElement()方法中，我们将isHidden属性设置为false，以显示元素，并使用scrollIntoView()方法将元素滚动到可见区域。

请注意，这只是一个示例，具体的实现方式可能因项目需求而有所不同。另外，腾讯云并没有与Angular直接相关的产品或服务，因此无法提供相关的推荐产品和链接地址。