时间戳

首页 > 解决方案 > 错误类型错误：无法读取未定义的属性“焦点”

angular - 错误类型错误：无法读取未定义的属性“焦点”

问题描述

*ngIf="pageNumber==3"为什么我在重定向到另一个页面时以及在重定向之后重定向之前一直收到此错误“TypeError：无法读取未定义的属性'焦点'” *ngIf="pageNumber==2"？

这是我的 html 文件

<mat-form-field>
    <input #employeeNameInput="matInput" (focus)="form.controls.employeeName.focused = true" matInput formControlName="employeeName">
</mat-form-field>

<p><span [routerLink]="['/prasymas-atleisti-is-darbo', 2]" class="top-space"
         [innerHTML]="form.controls.employeeName.value" (click)="setFocus(employeeNameInput)"
         [ngClass]="{'focused': form.controls.employeeName.focused == true }"
         (clickElsewhere)="clickOff('employeeName')" [typeInput]="employeeNameInput"></span>
</p>

这是我的 ts 文件

@ViewChild('employeeNameInput') employeeNameInput: MatFormField

setFocus(input: MatInput) {
    input.focus();
}

问题是当*ngIf="pageNumber==3"元素被隐藏时，但是当*ngIf="pageNumber==2"元素重新出现并且没有被隐藏时，如何使它起作用*ngIf？

标签： angulartypescript

解决方案

从您上面提供的有限代码示例中，如果您的问题，我猜如下。但还需要更多的确认。

@Viewchild 的目标是您在 DOM 中的引用。如果您使用 *ngIf 隐藏包含您在 ViewChild 中定位的组件的部分，您将无法访问它！

这是因为 *ngIf 会主动从 DOM 中移除元素，而不是简单地隐藏它。你可以用它[hidden]来避免这种情况。

[hidden]='pageNumber !==2'- 例如

推荐阅读