时间戳

首页 > 解决方案 > 引用变量被视为未使用和未定义。为什么？

javascript - 引用变量被视为未使用和未定义。为什么？

问题描述

我在我的 HTML 代码中使用引用将输入的值传递给 JavaScript 函数。然而，虽然一个引用变量 ( #options) 工作正常，但另一个 ( #current) 在一个地方被标记为“未解析/未定义”，并在其声明中标记为“未使用”。我无法弄清楚它们之间有什么区别以及为什么会这样。

我知道这不是重复引用的问题，因为current如果将其放置在其自己的输入元素中的（单击）事件中，则可以正常工作；但是，这也不是范围问题，因为输入引用options很好。那么为什么图标函数不能作为current回报引用呢？

<ng-container matColumnDef="maxInstalls">
        <th mat-header-cell *matHeaderCellDef>Max Installs</th>
        <td mat-cell *matCellDef="let profile">
          <input #current (click)="showDiv(options)" class="hiddenInput" type="number" min="0"
                 *ngIf="(profile.maximumInstalls > 0)" value="{{profile.maximumInstalls}}">
          <input #current (click)="showDiv(options)" class="hiddenInput" type="number" min="0"
                 *ngIf="(profile.maximumInstalls == 0)" value="">
          <div #options hidden="true">
            <mat-icon (click)="changeMaxInstalls(current, profile, options)">done</mat-icon>
            <mat-icon (click)="hideDiv(options)">clear</mat-icon>
          </div>
        </td>
      </ng-container>

我希望changeMaxInstalls()将current变量传递给函数；但是，它会引发current未定义的错误。此外，在我的 IDE 中，#current引用的声明被标记为“未使用的局部变量”。showDiv()和hideDiv()参考options没有问题。

标签： javascriptangularvariablesreference

解决方案

您对两个元素使用相同的模板引用变量#current)( 。这些变量旨在在整个模板中是唯一的。Angular 文档在我链接的帖子中说以下内容：

引用变量的范围是整个模板。不要在同一个模板中多次定义同一个变量名。运行时值将是不可预测的。

推荐阅读