时间戳

首页 > 解决方案 > 是否可以直接从模板中获取 nativeElement 引用？

angular - 是否可以直接从模板中获取 nativeElement 引用？

问题描述

我想获得本地主机元素，mat-checkbox所以我可以做到itemCheckbox.click()。现在，itemCheckbox是一个MatCheckbox. 我可以直接在模板中获取对本机元素的引用吗？

  <mat-checkbox
                #itemCheckbox
                (click)="$event.stopPropagation()"
                (change)="$event ? selection.toggle(row) : null"
                [checked]="selection.isSelected(row)">
  </mat-checkbox>

理想情况下，我会想象这样的事情

<our-component #item="ElementRef"></our-component>

PS。这是一个通用问题。我知道我可以itemCheckbox.toggle()，但关键是要获得组件的本机元素引用。另外，我知道我可以@ViewChild给定组件并从那里获取本机元素，但这不是重点。

标签： angular

解决方案

您可以为此目的使用 @viewChild() ，如下所示：

@ViewChild('itemCheckbox') private itemCheckbox: MatCheckbox;

请记住导入viewchild并MatCheckbox像这样：

import { ViewChild } from '@angular/core';
import { MatCheckbox } from '@angular/material';

然后你可以在你的代码中访问它：

this.itemCheckbox.checked

推荐阅读