Arhn - архитектура программирования

Автозаполнение пользовательского интерфейса Angular 2 Kendo не работает для чисел

У меня есть поле автозаполнения

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

        </kendo-autocomplete>

Автозаполнение отлично работает для массива строк. Я пытаюсь добиться автозаполнения для почтового индекса. Несмотря на то, что я объявляю его как массив строк, похоже, это не имеет значения.

Я получаю следующую ошибку, когда я выбираю значение в автозаполнении

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] (

Я много копался, и я не могу найти правильный ответ на этот вопрос. Я даже пытался изменить Number.prototype.toLowerCase, как указано в этом сообщении.

angular kendo-ui kendo-ui-angular2
14.09.2017

Ответы:


1

Когда элементы списка, к которым привязано автозаполнение, являются фактическими строками, кажется, что компонент работает так, как ожидалось:

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 = '';
}

РАБОТАЕТ

... в то время как описанная ошибка возникает только тогда, когда элементы являются числами:

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;
}

НЕ РАБОТАЕТ/ОШИБКА

Убедитесь, что значение модели, к которому привязано автозаполнение через ngModel, имеет строковый тип, а также что элементы списка также являются строками.

Если проблема не устранена, было бы полезно поделиться аналогичным исполняемым примером, в котором можно наблюдать ошибку.

14.09.2017
  • Спасибо. Мне пришлось явно преобразовать его в строку, хотя целевой массив был объявлен как Type Array‹String› 14.09.2017
    • Новые материалы
    Коллекции публикаций по глубокому обучению
    Последние пару месяцев я создавал коллекции последних академических публикаций по различным подполям глубокого обучения в моем блоге https://amundtveit.com - эта публикация дает обзор 25..
    Представляем: Pepita
    Фреймворк JavaScript с открытым исходным кодом Я знаю, что недостатка в фреймворках JavaScript нет. Но я просто не мог остановиться. Я хотел написать что-то сам, со своими собственными..
    Советы по коду Laravel #2
    1-) Найти // You can specify the columns you need // in when you use the find method on a model User::find(‘id’, [‘email’,’name’]); // You can increment or decrement // a field in..
    Работа с временными рядами спутниковых изображений, часть 3 (аналитика данных)
    Анализ временных рядов спутниковых изображений для данных наблюдений за большой Землей (arXiv) Автор: Рольф Симоэс , Жильберто Камара , Жильберто Кейрос , Фелипе Соуза , Педро Р. Андраде ,..
    3 способа решить квадратное уравнение (3-й мой любимый) -
    1. Методом факторизации — 2. Используя квадратичную формулу — 3. Заполнив квадрат — Давайте поймем это, решив это простое уравнение: Мы пытаемся сделать LHS,..
    Создание VR-миров с A-Frame
    Виртуальная реальность (и дополненная реальность) стали главными модными терминами в образовательных технологиях. С недорогими VR-гарнитурами, такими как Google Cardboard , и использованием..
    Демистификация рекурсии
    КОДЕКС Демистификация рекурсии Упрощенная концепция ошеломляющей О чем весь этот шум? Рекурсия, кажется, единственная тема, от которой у каждого начинающего студента-информатика..