当angular2中的keyup事件发生时，防止单击事件的默认值

Question

在搜索输入字段中，当keyup事件被触发时，数据显示，在keyup事件再次触发后，click事件正在运行，但是我希望一旦keyup或click被触发，其他的将无法正常工作。

以下是 header.html

中的表单

<form>
     <div class="box">
         <div class="container-1">
            <input type="search" id="search" placeholder="Type 
                 your search..." name="searchStr" (keyup.enter)="searchKey(input.value)" 
                [(ngModel)]="searchStr" #input>
            <a (click)="searchKey(input.value)"><img 
              src="/assets/search.png" class="search-img"></a>
        </div>
     </div>
</form>

这是我的 header.component.ts

searchKey(value: any) {
    console.log(value);
    this.router.navigate(['search', { searchkey : value }]);
}

提前谢谢。

Answer 1

尝试设置一个标志变量，它将检查是否要搜索，

export ... {

    flag = true;

    searchKey(value: any) {
        console.log(value);
        this.flag && this.router.navigate(['search', { searchkey : value }]);
        this.flag=false;
    }

    // don't forget to add a condition when flag must be set to true.
}

希望这会对你有所帮助。