как получить значение ng-модели в директиве - PullRequest
1 голос
/ 05 апреля 2020

Я написал директиву в AngularJS и использовал номер типа ввода с атрибутами min-max и ng-model. Я использовал изолированную область. В директиве я написал событие размытия. Я получаю минимальное или максимальное значение, но не получаю ng-model значение:

<input my-directive min="5" max="10" ng-model="num" type="number">
myApp.directive('myDirective', function () {
  function link($scope, ele, attr) {
    $scope.$watch('num', function (value) {
      console.log(value);
    })
    ele.on('blur', function () {
      console.log($scope.num, $scope.min, $scope.max);
    })
  }
  return {
    restrict : 'A',
    scope: {
      num: "=ngModel",
      min: "=?",
      max: "=?"
    },
    link: link
  }
});

вывод: неопределено 5 10

Что я делаю неправильно?

1 Ответ

1 голос
/ 05 апреля 2020

Вместо использования привязки к ngModel, require оно и внедрение его в функцию ссылки:

myApp.directive('myDirective', function () {
  function link($scope, ele, attr, ngModel) { // <--- inject
    $scope.$watch(() => ngModel.$viewValue, (n, o) => {
      // watching `ngModel.$viewValue`
      console.log('WATCH', n, o);
    })
    ele.on('blur', function () {
      // `ngModel.$viewValue` is the current value
      console.log('BLUR', ngModel.$viewValue, $scope.min, $scope.max);
    })
  }
  return {
    require: 'ngModel', // <--- require 
    restrict : 'A',
    scope: {  // <--- remove `ngModel` binding from scope
      min: "=?",
      max: "=?"
    },
    link: link
  }
});

Вот демо

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...