时间戳

首页 > 解决方案 > 模板引用变量给出_r0不是函数错误

angular - 模板引用变量给出_r0不是函数错误

问题描述

我有一个搜索字段，当按下回车键时会触发搜索方法。

 <mat-form-field class="search-field">
    <mat-label>Search</mat-label>
    <input type="text" (keyup.enter)="search($event)"  matInput #search>
    <mat-icon matSuffix>search</mat-icon>
  </mat-form-field>

当我按下搜索按钮时，出现以下错误

ERROR TypeError: _r0 is not a function
    at UploadPhotoComponent_Template_input_keyup_enter_4_listener (upload-photo.component.html:4)
    at executeListenerWithErrorHandling (core.js:14296)
    at wrapListenerIn_markDirtyAndPreventDefault (core.js:14331)
    at platform-browser.js:582
    at platform-browser.js:1278
    at ZoneDelegate.invoke (zone-evergreen.js:364)
    at Object.onInvoke (core.js:27149)
    at ZoneDelegate.invoke (zone-evergreen.js:363)
    at Zone.runGuarded (zone-evergreen.js:133)
    at NgZone.runGuarded (core.js:27060)

但是，当我将模板引用变量从 #search 更改为 #searchFiled 时，它工作正常

  <mat-form-field class="search-field">
    <mat-label>Search</mat-label>
    <input type="text" (keyup.enter)="search($event)"  matInput #searchFiled>
    <mat-icon matSuffix>search</mat-icon>
  </mat-form-field>

这是什么原因？

标签： angular

解决方案

就我而言，我将登录函数命名为与我的本地模板变量之一相同

<form #login="ngForm">
            <input type="email" name="Email" #Email="ngModel" required email [(ngModel)]="email" placeholder="Enter Email">
                
            <br>
            <input type="password" name="Password" #Password="ngModel" required [(ngModel)]="password" placeholder="Enter Password">
            <br>
            <span *ngIf="showMsg">Login Failed !</span>
            <button type="button" (click)="login()" [disabled]="login.invalid">LOGIN</button>
</form>

推荐阅读