автозаполнение в AngularJS и ng-grid

Эта ссылка очень помогает в создании директивы «автозаполнение» с тегом. Проблемы с автозаполнением jQuery + AngularJS

Однако у меня есть следующая проблема:

Я знаю, что для обработки событий после выбора в списке автозаполнения следует использовать обработчик событий, предоставленный jqueryUI.

...
     link: function(scope, elem, attr, ctrl) {
                elem.autocomplete({
                        source: datasource,
                        select: function( event, ui ) {
                             console.log(ui.item.value); 
                             console.log(attrs.ngModel);
                             //but how can I change the value of this ngModel in scope?
                        }

                    });
     };

Однако в директиве, как я могу повлиять на значение этого ngModel? Я могу получить имя этой ngModel, используя attrs.ngModel. (зная, что имя ng-модели является динамическим, и я могу получить значение, используя ui.item.value)

У кого-нибудь есть идея? Заранее большое спасибо!


person dellgg    schedule 03.04.2013    source источник
comment
Стоимость чего именно?   -  person Justen    schedule 03.04.2013
comment
Привет Джастен спасибо за ваш ответ. На самом деле, я могу получить имя ngModel, но хочу изменить значение этого ngMoel в директиве.   -  person dellgg    schedule 04.04.2013


Ответы (2)


Не уверен, что у вас уже есть область действия, определенная в вашей директиве, но вот пример:

myApp.directive("myDirective", function() {
  return {
    restrict: 'A',
    require: 'ngModel',
    scope: {
      ngModel: '='
    },
    link: function(scope, element, attrs) {
      // monitor plugin and set value to ngModel
      element.plugin({
        onChange: function(newValue) {
          scope.$apply(function() {
            scope.ngModel = newValue;
          });
        }
      });

      // monitor ngModel and set new value to element/plugin
      scope.$watch('ngModel', function(newValue, oldValue) {
        element.val(newValue);
      });
    }
  };
});
person Manuel van Rijn    schedule 04.04.2013
comment
Большое спасибо мк! Это именно то, что я хочу. - person dellgg; 04.04.2013

ОК, поиграв с этим примером несколько часов (я только изучаю angular), я понял, что для установки значения вам нужно следующее:

ngModel.$setViewValue(elm.val());

В частности, ваш код должен выглядеть так:

require: 'ngModel',
 link: function(scope, elem, attr, ctrl) {
            elem.autocomplete({
                    source: datasource,
                    select: function( event, ui ) {
                         console.log(ui.item.value); 
                         console.log(attrs.ngModel);

                         ctrl.$setViewValue(elem.val());

                         //but how can I change the value of this ngModel in scope?
                    }

                });
 };

Итак, я проверил это, это работает.

person Tim    schedule 08.07.2014