Блог

Главная - Вопросы по программированию - Поиск по типу Angular2 с обещанием

Поиск по типу Angular2 с обещанием

#angular #promise #semantic-ui #typeahead #angular2-forms

#angular #обещание #семантический пользовательский интерфейс #заголовок типа #angular2-формы

Вопрос:

Я использую Angular2 и Semantic-UI для создания элемента поиска в моей форме, который выполняет поиск по типу «typeahead».

Вот код в компоненте, который вызывает службу:

 getData(typeahead: string): void {
    this.myDataService.getData(typeahead).then(list => {
        this.list = list;
    });
}

И вот код в шаблоне для элемента поиска:

 <div class="field">
    <div class="ui search">
        <div class="ui icon input">
            <input class="prompt" type="text" [formControl]="myForm.controls.item">
            <i class="search icon"></i>
        </div>
        <div class="results"></div>
    </div>
</div>

Я предпринял несколько попыток в соответствии с примерами, предоставленными Semantic-UI.
Но я не могу заставить это работать.

 $('.ui.search')
  .search({
    apiSettings: {
      url: '//api.github.com/search/repositories?q={query}'
    },
    fields: {
      results : 'items',
      title   : 'name',
      url     : 'html_url'
    },
    minCharacters : 3
  })
;

Он должен вызывать службу каждый раз, когда пользователь вводит новый ввод, но я не могу понять, как с этим справиться.
Есть ли у вас какие-либо идеи о том, как использовать Angular2 Promise с jQuery-кодом элемента поиска Semantic-UI?

Комментарии:

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

2. Я не получаю никакой ошибки, я не могу понять, как использовать мой асинхронный вызов с apiSettings , который, похоже, получает URL, а не обещание.

3. Можете ли вы поместить это в plunkr . Я помогу вам исправить это, если вы сможете разместить его там.

4. Я вернусь к этому на следующей неделе … ты можешь подождать? ‘: D

5. конечно. просто отметьте меня