Angular 4指令 - 按Enter键

Question

使用此自定义指令当我按下回车键时，我可以选择另一个输入字段。

如果目标是另一个输入字段，它可以正常工作，但如果目标是复选框则不行。

这就是我使用它的方式：

     <mat-card class="inputdata">
                <mat-card-content>
                    <mat-form-field>
                        <input matInput id="certificato" onReturn="cognome">
                        <mat-hint align="start">Numerico</mat-hint>
                        <mat-hint align="end">{{cert.value.length}} / 3</mat-hint>      
                      </mat-form-field>
                  </mat-card-content>
            </mat-card>
    <mat-card class="inputdata">    
                <mat-form-field>                   
                    <input matInput id="cognome" onReturn="checkone">
                    <mat-hint align="start">A-Z</mat-hint>
                    <mat-hint align="end">{{cognome.value.length}}</mat-hint>          
              </mat-form-field>
        </mat-card>
  <mat-card class="inputdata" style="text-align:left">
    <mat-checkbox id="checkone" >Check One</mat-checkbox> 
 </mat-card>

这是指令

@Directive({
    selector: '[onReturn]'
})
export class OnReturnDirective {
    private el: ElementRef;
    private nextEl: string;
    @Input() onReturn: string;
    constructor(private _el: ElementRef) {
        this.el = this._el;
        this.nextEl = this.el.nativeElement.getAttribute("onReturn");
    }
    @HostListener('keydown', ['$event']) onKeyDown(e) {
        if ((e.which == 13 || e.keyCode == 13)) {
            e.preventDefault();
            let elem = document.getElementById(this.nextEl);
            if (elem) {              
              elem.focus();
            }
            else{
                console.log('close keyboard');
            }
            return;
        }    
    }    
}

有什么建议吗？