如何在 ionic Angular 中自动启用按钮而不点击它？

Question

我希望在页面加载时正确单击第一个按钮，我使用 html、css、typescript 构建它

`<div class="media-column">
 <!-- posts button -->
    <button #postsButton class="media-button"(click)="applyFilter('posts')">
      <span class="media-label">Posts</span>
    </button>
  <!-- images button -->
    <button class="media-button"(click)="applyFilter('images')">
      <span class="media-label">Pictures</span>
    </button>
 <!-- videos button -->
  <button class="media-button" (click)="applyFilter('videos')">
      <span class="media-label">Videos</span>
    </button>
  </div>`

我尝试过，但没用，我没有点击按钮

 `@ViewChild('postsButton', { static: true }) postsButton!: ElementRef;

ngOnInit() {   
      this.postsButton.nativeElement.click();
  }`

Answer 1

在

ngOnInit()

期间，模板中的元素尚未渲染。您需要使用

ngAfterViewInit()

来代替。

@ViewChild('postsButton', { static: true }) postsButton!: ElementRef;

ngAfterViewInit() {   
  this.postsButton.nativeElement.click();
}

有关组件生命周期的更多信息，请查看 docs。