AngularJS — ввод асинхронных данных

Я использую загрузчик Typeahead с anguarJS для извлечения данных из API рельсов, проблема в том, что запрос получает данные каждый раз, когда я набираю букву на входе, я хочу выполнить и немного уменьшить количество запросов и отменить их до сделать соответствие между тем, что напечатано, и полученными данными.

вот контроллер:

 getSpecificationTemplatesNames = (value) ->
    dataStore.post DATASTORE_CACHE_KEY, "/specification_templates/specification_templates_names",{post: {search: value}},(data) ->
      $scope.names = data.templates.names


  # --- WATCHER ---

  $scope.$watch 'specificationTemplate.name', (value)  ->
    $scope.specificationDisabledForm = !value
    getSpecificationTemplatesNames(value)

и вот часть haml:

 .col-md-8
          %input.specification-template-name{ type: 'text', name: 'name', typeahead: 'name for name in names | filter:$viewValue | limitTo:15', typeahead_wait_ms:'2000',
                        ng: { model: 'specificationTemplate.name', disabled: 'contractPeriod.isArchived()' }}

В примере документа ui-bootstrap версии 0.12.1 асинхронная загрузка запускается через typeahead="address for address в getLocation($viewVlue), но они не используют наблюдатель за моделью Их метод getLocations — это мой метод getSpecificationTemplatesNames.

может ли кто-нибудь помочь выполнить это и преобразовать со мной код и правильно использовать параметр typeahead-wait-ms с помощью coffeescript!


angularjs coffeescript typeahead debounce angular-ui-bootstrap
person Community    schedule 13.04.2018    source источник
comment
Возможный дубликат https://stackoverflow.com/questions/40126717/ui-bootstrap-typeahead-how-to-combine-http-with-debounce   -  person Jon Senchyna    schedule 13.04.2018
comment
немного другой @JonSenchyna   -  person    schedule 13.04.2018
comment
Вы пробовали использовать ng-model-options="{'debounce': ...}"?   -  person Jon Senchyna    schedule 13.04.2018
comment
в документе нет опции ng-model-option! angular-ui.github.io/bootstrap/versioned- документы/0.12.1/#/   -  person    schedule 13.04.2018
comment
Это потому, что это не часть typeahead, а часть самого angularJS: docs.angularjs. org/api/ng/directive/ngModelOptions   -  person Jon Senchyna    schedule 13.04.2018

Ответы (2)


arrow_upward
0
arrow_downward

Ваша проблема в том, что вы неправильно определяете typeahead-wait-ms. У вас есть символы подчеркивания в имени атрибута, а не тире.

Кроме того, вы можете использовать ng-model-options="{'debounce': ...}", чтобы добавить устранение дребезга при обновлении вашей модели.

person Jon Senchyna    schedule 13.04.2018
comment
На самом деле этот код работает правильно, потому что в проекте мы настраиваем синтаксис и используем coffeescript, поэтому подчеркивание работает - person ; 13.04.2018
comment
и проблема в том, что запрос на сервер запускается каждый раз, когда я набираю символ во входных данных, поэтому я хочу уменьшить количество запросов, как это делается в документе: angular-ui.github.io/bootstrap/versioned-docs/0.12.1/#/ - person ; 13.04.2018

arrow_upward
0
arrow_downward

это решение, которое я нашел, используйте обещание:

часть ветчины:

 %input.specification-template-name{ type: 'text', name: 'name', typeahead: 'name for name in getSpecificationTemplatesNames($viewValue) | limitTo:15', typeahead_wait_ms:'1000',
                        ng: { model: 'specificationTemplate.name', disabled: 'contractPeriod.isArchived()' }}

угловой контроллер:

$scope.getSpecificationTemplatesNames = (value) ->
    $q( (resolve, reject) ->
     dataStore.post DATASTORE_CACHE_KEY, "/specification_templates/specification_templates_names",{post: {search: value}},(data) ->
        resolve( data.templates.names || [] )
    )

  # --- WATCHER ---

  $scope.$watch 'specificationTemplate.name', (value)  ->
    $scope.specificationDisabledForm = !value
person Community    schedule 13.04.2018