代码之家 › 专栏 › 技术社区 › Devmix

角度的指令问题

primeng typescript angular

0

Devmix · 技术社区 · 6 年前

我有一个下拉菜单,效果很好。如果用户选择一个选项,然后按 “删除” 或 “退格” 键盘上的按钮下拉列表中的值将被清除( ).但是,我正在尝试创建一个那也可以做同样的事情,但我不能让它工作。有人能告诉我如何正确创建此指令的正确方向吗?

这是我的密码:

LIVE DEMO

onKeyUp(evt){
   if(evt.keyCode === 8){
     this.isShowClear = false;
     let currentElementName = evt.currentTarget.getAttribute('name');
     this.myForm.controls[currentElementName].patchValue('');
 }
}

onChange(){
this.isShowClear = true;
}

2 回复 | 直到 6 年前

1

Farhat Zaman 6 年前

这是一个指令代码

@Directive({
  selector: '[customDropDown]'
})
export class CustomDropDownDirective {

  @Output() updateProperty: EventEmitter<any> = new EventEmitter();

  constructor(private el: ElementRef, private control : NgControl) { }

    @HostListener('keyup',['$event'])onkeyup(event:any){
    if(event.keyCode === 8){
       let currentElementName = this.el.nativeElement.value;
      this.control.control.setValue('');
      this.updateProperty.emit(false);
    }
  }
}

这里是一个链接 LIVE DEMO app.component.ts 这就是为什么他没有在演示中工作。

2

0

hardy 6 年前

你可以用按键有助于你们及时了解事件的东西按键 . 可以这样做

@HostListener('document:keypress', ['$event'])
  handleKeyboardEvent(event: KeyboardEvent) { 
    this.key = event.key;

    // inside this you can catch your key code
    // then check is it backspace or delete keycode 
    // if it is then remove data from selector with help of NgControl.
  }

别忘了从@angular/core导入NgControl。