Question

我有一个自动填充字段

<kendo-autocomplete
          [data]="postCodes"
          [placeholder]="'Search for a PostCode'"
          [suggest]="true"
          (valueChange)="valueChange($event)"
          [(ngModel)]="hospital"
        >

        </kendo-autocomplete>

自动完成功能适用于字符串数组。我正在尝试为Postcode实现自动完成功能。即使我将它声明为字符串数组，但它似乎没有什么区别。

当我在自动填充

中选择值时，我收到以下错误

AutoCompleteComponent.html:2 ERROR TypeError: this.suggestedText.toLowerCase is not a function
    at AutoCompleteComponent.get [as suggestion] (autocomplete.component.js:160)
    at Object.eval [as updateDirectives] (AutoCompleteComponent.html:7)
    at Object.debugUpdateDirectives [as updateDirectives] (

我做了很多挖掘，似乎无法得到正确答案。我甚至尝试修改了这个Post

中提到的Number.prototype.toLowerCase

Answer 1

当AutoComplete绑定的列表项是实际字符串时，该组件似乎按预期工作：

import { Component } from '@angular/core';

@Component({
  selector: 'my-app',
  styles: ['.countries { width: 300px; }'],
  template: `
    <div class="example-wrapper">
        <kendo-autocomplete
          [data]="postCodes"
          [placeholder]="'Search for a PostCode'"
          [suggest]="true"
          [(value)]="zipCode"
        >

        </kendo-autocomplete>
        <hr />
        <pre>Selected code: {{zipCode}}</pre>
    </div>
   `
})
export class AppComponent {
    public postCodes: Array<string> = [
     "1234",
     "2345",
     "9999"
     ];

     public zipCode = '';
}

WORKING

...虽然只有当项目是数字时才会出现所描述的错误：

import { Component } from '@angular/core';

@Component({
  selector: 'my-app',
  styles: ['.countries { width: 300px; }'],
  template: `
    <div class="example-wrapper">
        <kendo-autocomplete
          [data]="postCodes"
          [placeholder]="'Search for a PostCode'"
          [suggest]="true"
          [(value)]="zipCode"
        >

        </kendo-autocomplete>
        <hr />
        <pre>Selected code: {{zipCode}}</pre>
    </div>
   `
})
export class AppComponent {
    public postCodes: Array<string> = [
     1234,
     2345,
     9999
     ];

     public zipCode;
}

NOT WORKING/ERROR

确保通过ngModel绑定到AutoComplete的模型值是string类型，以及列表项也是字符串。

如果问题仍然存在，那么分享一个可以观察到错误的类似可运行示例会很有帮助。

Angular 2 Kendo UI自动完成功能不适用于数字

1 个答案: