如何解决:在HTMLAnchorElement.onclick中未定义function()

时间:2019-06-30 07:20:31

标签: html angular typescript

我正在尝试使用选择选项来浏览参数并将其注册到我的URL。 我要做的第一件事就是移到另一个URL。

当我尝试通过非常简单的if条件使用函数时,我面临着这个问题。 我有一个接口,上面有一些名字,我说:如果此名称= true,则onClick转到该URL。

这是Options HTML片段:

<t t-call..

这是我的方法:

  <select ([ngModel])="clientType" style="width: 15%" class="browser-default custom-select">
     <option selected>Client Type</option>
     <option value="1">MRN</option>
     <option value="2">MRR</option>
     <option value="3">MRE</option>
  </select>

这是用于调用函数的按钮:

   onBtnClicked() {
     if(this.clientType.MRR){
      this.router.navigate(['/cont']);
        }

我尝试将 <a class="btn-floating btn-lg white" id="btn-filter" onclick="onBtnClicked()"><mdb-icon size="4" fas icon="search"></mdb-icon></a> 更改为this.router.navigate,但是没有用。

我在网上找到了一些东西,但是要么解释很奇怪,要么不属于我的主题

尝试答案后,我得到了一个新错误:

return this.router.navigate

2 个答案:

答案 0 :(得分:0)

ngModel应该这样写[(ngModel)],如果要比较clientType的值,则应该执行以下操作:

onBtnClicked() {
  if(this.clientType === '2') { // value of MRR is 1
    this.router.navigate(['/cont']);
  }
}

在锚标记中,使用角度事件(click)而不是HTML onclick

<a class="btn-floating btn-lg white" id="btn-filter" (click)="onBtnClicked()"><mdb-icon size="4" fas icon="search"></mdb-icon></a>

答案 1 :(得分:0)

函数is not defined是因为onclick是一个JavaScript处理程序,而Angular应用是模块化的。因此,无论您调用什么函数,它都会得到一个像__webpack__.__module__.fn()之类的路径。

您应该使用Angular的(click)=fn()来监听点击。还是旧的on-click=fn()