Question

我正在Angular 2中构建子组件，并且需要能够从自动完成列表中选择一个值。该列表是一个简单的常用数字列表（单个数字），它将用作用户的提醒（也使其更容易使用，因为通常需要这些值）。我得到了正确的列表，我可以选择值，但我需要这些值来触发输入菜单中的（更改）事件（或在自动完成本身中触发它）。我设法通过单击选项使其工作，但是当您使用键盘导航并使用回车确认时不能。

我的组件和html模板:(我从父级传递数据时代码段不起作用）

＆＃13;

import {Component, EventEmitter, Input, Output} from "@angular/core";
import {FormControl} from "@angular/forms";

@Component({
  selector: 'hourcomponent',
  templateUrl: './hour.component.html',
  styleUrls: ['./hour.component.css']
})

export class hourComponent {
  @Input() uur = "";
  @Input() type: boolean;
  @Input() edit: boolean;
  @Input() day: number;
  @Input() mostUsed: number[];
  @Output() Callback = new EventEmitter<number>();

  stateCtrl: FormControl;
  dagen = ["MA", "DI", "WO", "DO", "VR", "ZA", "ZO"];

  callback(uur: string){
    var tijd = parseInt(uur);
    this.Callback.emit(tijd);
  }
}

＆＃13;

<td>
  <md-input-container>
    <input mdInput [(ngModel)]="uur" placeholder="{{dagen[day]}}" [disabled]=edit (change)="callback(uur)" [mdAutocomplete]="auto">
  </md-input-container>

</td>
<md-autocomplete #auto="mdAutocomplete">
  <md-option *ngFor="let most of mostUsed" [value]="most" (click)="callback(most)" >
    {{most}}
  </md-option>
</md-autocomplete>

＆＃13;

选择自动完成选项时，具有自动完成功能的角度2输入字段不会调用更改方法

0 个答案: