角度4单击按钮功能未触发 [英] angular 4 click button function is not fired

问题描述

我正在尝试检查文本输入是否为空或不存在角度4.为此，我没有使用表格.这只是一个输入字段.当我在下面的按钮中执行addLocaton函数时，需要进行检查.

I am trying to do a check if a text input is empty or not in angular 4. I am not using forms for this. It's just an input field. When I execute the addLocaton function in the button below the check needs to happen.

我的输入字段

my input field

<ion-input type="text" placeholder="Enter a Town, Province or City" name="newPlace" [(ngModel)]="newPlace" id="empty"></ion-input>

<button ion-button block type="submit" (click)="addLocation()">ADD AND SAVE MORE LOCATIONS</button>

ts文件

ts file

  addLocation(){
     if( document.getElementById('empty').value === '' ){
          alert('empty');
     }
  }

推荐答案

正确的方法

更改type="button"而不是type="submit"

 <button ion-button block type="button" (click)="addLocation(newPlace)">ADD AND SAVE MORE LOCATIONS</button>

但是您可以使用这种方法通过方法传递模型对象，而不是使用普通的JavaScript代码

But you could do this way for passing the model object via method instead of using plain JavaScript code

addLocation(newPlace){
     if(newPlace === '' || newPlace === undefined ){
          alert('invalid');
     }
  }

或使用双向绑定

(click)="addLocation()"

ts可能是

addLocation(){
         if(this.newPlace === '' || this.newPlace === undefined ){
               alert('invalid');
         }
      }

这篇关于角度4单击按钮功能未触发的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！