Javascript 当用户输入文本并点击enter键或单击数据列表中的项目时触发事件

我有一个供用户输入多封电子邮件的输入字段，以及一个显示在数据列表中的以前使用过的电子邮件列表。每次用户在框中输入文本并点击enter键，或从数据列表中选择值时，我都要调用onNewToEmailAdded（）方法。我该怎么做（我用的是Angular 2）。此时，仅当从列表中选择某个项目后按enter键时，才会调用该方法

<input type="email" class="form-control" [(ngModel)]="nweEmail" (keyup.enter)="onNewToEmailAdded()" 
     list="toEmailsList" />
<datalist id="toEmailsList">
   <option *ngFor="let email of previousToEmails">{{email}}</option>
</datalist>

{{email}}

由于datalist上缺少事件，当在列表上单击电子邮件时，您无法直接触发事件，因此您的解决方案只能在选择后按enter键。但您仍然可以通过在输入元素上使用（input）事件来使用变通方法，如：

<input type="email" class="form-control" (input)="compareInput($event.target.value) "[(ngModel)]="nweEmail" (keyup.enter)="onNewToEmailAdded()" 
     list="toEmailsList" />
<datalist id="toEmailsList">
   <option *ngFor="let email of previousToEmails">{{email}}</option>
</datalist>

请记住，这样做，当用户键入前一个列表中的电子邮件而未选择它时，一旦到达最后一个字符，事件将在选择时触发，这可能会导致用户的奇怪行为

compareInput(value) {
//if value is in the list do something
}