Question

keypress事件未在角度2中使用回车键触发，以下是html和angular 2代码：

HTML

<input [(ngModel)]="filters[i]" type="number" size="30" pInputText (keypress)="filterByField($event, col.field, fieldType.TEXT)" class="{{'input-'+col.field}}" title="Only numbers are allowed" />

Angular 2

filterByField(event, field, fieldType){
    console.log(event)
    if(fieldType === this.fieldType.DD){
        event.originalEvent.stopPropagation();
        this.resetFilterBy(event.value, field);
        this.loadData(null, true);
    }
    else if(fieldType === this.fieldType.TEXT){
        let charCode = (event.which) ? event.which : event.keyCode;
        console.log(charCode)
        if (charCode == 101 && field == this.fields.TASKID.field){
            event.preventDefault();
            return false;
        }
        if((charCode === 13  && event.target.value.trim() !== "") || (charCode === 8) || (charCode === 46)) {
            let filterValue = event.target.value;
            this.resetFilterBy(filterValue, field);
            this.loadData(null, true);
        }
    }
}

Answer 1

如果您只需要收听输入按键事件，那么您可以使用＆＃34; keyup.enter＆＃34;您的HTML中的事件如：

<input #box (keyup.enter)="onEnter(box.value)">

希望这会有所帮助。：）

Answer 2

由于filterByField函数的额外参数

，可能会中断

(keypress)="filterByField($event, col.field, fieldType.TEXT)"

作为调用的一部分传递，确保您在HTML中绑定的所有属性都在组件中定义。

Answer 3

@Component({
    selector: 'my-search',
    template: `
              <input #criteria type='text' placeholder="Enter criteria" (keypress)="preventNumbers($event)"  />
              <button (click)="search(criteria.value)">Search</button>
              `
})

export class MySearchComponent { 
    preventNumbers(e) {
        console.log(e.keyCode);
        if (e.keyCode >= 48 && e.keyCode <= 57) {
            // we have a number
            return false;
        }
    }
    search(criteria) {
        console.log("search for " + criteria);
    }
}

按键事件没有使用角键2中的输入键触发

3 个答案: