Question

我正在使用角度ng2-materialize lib，当我尝试使用ngModel输入时使用自动完成功能时遇到了障碍：

@Component({
    selector: 'item-list',
    template: `
    <mz-input-container>
        <input mz-input [(ngModel)]="item" [autocomplete]="items" type="text">
    </mz-input-container>
    `
})
export class MyComponent implements OnInit, OnDestroy {
    public item: string;
    public items: any;

    constructor(private service: MyService) {
        this.item = '';
        this.items = { data: {}, limit: 10 };
    }

    ngOnInit() {
        this.myservice.data.subscribe(data => {
            this.items.data = {};
            data.forEach(s => {
                this.items.data[s.name] = '';
            })
        });
    }
}

完成者工作并显示项目列表，我可以使用键盘移动它们或单击一个输入值更新，但我似乎无法找到一种方法来响应当前的值输入作为模型绑定不会改变。

我使用的不正确还是我错过了什么？

由于

Answer 1

您可以将方法绑定到ngModelChange。例如(ngModelChange)="respondToChange($event)"。 $event的值将是最新的ngModel值。

这样，当模型更新时，您可以执行所需的任何更新逻辑。

澄清：

<mz-input-container>
  <input mz-input [(ngModel)]="item" 
    (ngModelChange)="respondToChange($event)" [autocomplete]="items" 
    type="text">
</mz-input-container>

具有自动完成和ngModel的MzInput

1 个答案: