Как использовать функцию ng-change в директиве?

0

Я пытаюсь сделать автозаполнение, для этого я использую теги-ввод. Название директивы - моя директива. Внутренний контроллер. Я пытаюсь вызвать функцию selectUser, но он не работает.

В автозаполнении вы должны ввести 4 буквы, например: john, затем я покажу варианты.

Посмотреть

  <body ng-app="myApp" ng-controller="appCtrl">
    <my-directive  apipoint="customerApi" modeldisplay="tags.selected"  ng-model="tags.selected" change="selectUser(tags.selected)"></my-directive>
  </body>

контроллер

app.controller("appCtrl", function($scope){     
  $scope.tags = {};
  $scope.tags.selected = [];
  $scope.customerApi = ['tags.json'];
  $scope.selectUser = function(foo)  {
    $scope.aux = foo;
    alert();
  };
});

директива

app.directive("myDirective", ['$http',function($http){
  return {
    restrict: "E",
    template : 'Here Use tag-input: <tags-input ng-model="modeldisplay"'+
     'ng-change="change(modeldisplay)">'+
     '<auto-complete source="loadTags($query)"></auto-complete>'+
     '</tags-input>',
    require: 'ngModel',
    scope : {
      modeldisplay: "=",
      apipoint: "="
    },
    link : function(scope, element, attrs, ctrl){
      scope.loadTags = function(query) {
         return $http.get(scope.apipoint[0]);
      };
      scope.change = function(item){
        ctrl.$setViewValue(item);
      }
    }
  };
}]);

** DEMO/Now Working **

Демо-версия Plunker

Еще одна вещь: мой подход я прав?, Причина, позади, что, в Angularjs View, я хочу использовать auto-complete директив oneline, я хочу сделать это как общий подход...

  • 0
    В автозаполнении, вы должны ввести 4 буквы, такие как: Джон, тогда я покажу варианты ..
  • 0
    вам нужно вызвать переданную функцию в функции scope.change с помощью $scope.$apply(function) - scope.change = function(item){ $scope.$apply(item()) }
Показать ещё 3 комментария
Теги:

2 ответа

2
Лучший ответ

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

Вот рабочий плункер Plunker

  1. Вы использовали стороннюю директиву, которая не предусматривает ng-change. Да, но он предоставляет on-tag-added="change1(modeldisplay). Таким образом, ng-change не работал.

  2. Вы передали функцию в атрибуте изменения своей my-directive и снова в вашей области действия была другая функция изменения, которая создавала непонимание.

  3. Вы обращались к переданной функции с использованием области видимости, но вы не упомянули об этом в директивной изолированной области. То почему эта переданная функция была недоступна в области директивы.

  • 0
    спасибо-же думаю, что хочу .....
  • 0
    Не могли бы вы сказать: «Прав ли мой подход?». Причина в том, что в Angularjs View я хочу использовать директиву автозаполнения oneline, я хочу сделать ее универсальным подходом ...
2

Вам нужно что-то вроде этого?

Демо-версия Plunker

Изменения в директиве:

link: function(scope, element, attrs, ctrl) {
  scope.loadTags = function(query) {
    return $http.get(scope.apipoint[0]);
  };
  scope.updateModel = function(item) {
    ctrl.$setViewValue(item);
  };
},
controller: ['$scope', function($scope) {
  $scope.$watch('modeldisplay', function(newVal) {
    $scope.updateModel(newVal);
  });
}],

Прочтите это, если вам нужно больше объяснений:

Как реализовать ng-изменение для пользовательской директивы

  • 0
    Также прочитайте это: mbenford.github.io/ngTagsInput/gettingstarted ngTagsInput не имеет какого-либо атрибута ng-change, как я видел, вот почему вам нужно следить за областью действия в вашем контроллере директив.
  • 0
    Спасибо, это я искал, не могли бы вы сказать мне, почему я не смог позвонить нг-изменения ....
Показать ещё 7 комментариев

Ещё вопросы

Сообщество Overcoder
Наверх
Меню