Угловая директива для выбора номеров. Выражение не определено

Question

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

angular.module('app') 
    .directive('numberPicker', [NumberPicker]); 

function NumberPicker() { 

    var getTarget, getType; 

    getTarget = function (e) { return angular.element(e.target); } 

    getType = function (e) { return getTarget(e).attr('direction-type'); } 

    return { 
     restrict: 'E', 
     replace: true, 
     require: 'ngModel', 
     scope: { 
      value: '=' 
     }, 
     template: '<div class="ui action input">' + 
        '<input value="{{value}}" type="text" />' + 
        '<button class="ui icon button" type="button" direction-type="up" ng-class="{disabled : canUp === false}">' + 
         '<i class="angle up icon" direction-type="up"></i>' + 
        '</button>' + 
        '<button class="ui icon button" type="button" direction-type="down" ng-class="{disabled : canDown === false}">' + 
         '<i class="angle down icon" direction-type="down"></i>' + 
        '</button>' + 
        '</div>', 
     controller: function ($scope) {}, 
     link: function (scope, element, attrs, ctrl) { 

      scope.value = 0; 

      var options = { 
       min: 0, 
       max: 10, 
       step: 1 
      }; 

      scope.$watch('value', function (newValue) { 
       scope.canDown = newValue > options.min; 
       scope.canUp = newValue < options.max; 

       if (ctrl.$viewValue != newValue) { 
        ctrl.$setViewValue(newValue); 
       } 
      }); 

      var changeNumber = function (event) { 
       var type = getType(event); 
       if ('up' === type) { 
        if (scope.value >= options.max) { 
         return; 
        } 
        scope.value += options.step; 
       } 
       if ('down' === type) { 
        if (scope.value <= options.min) { 
         return; 
        } 
        scope.value -= options.step; 
       } 
      } 

      var btn = element.find('button'); 
      var input = element.find('input'); 

      btn.on('click', function (e) { 

       scope.$apply(function() { 
        changeNumber(e); 
       }); 

       e.preventDefault(); 
      }); 

      input.on('change', function (e) { 
       scope.value = input[0].value; 
       scope.$apply(); 
      }) 

      scope.$on('$destroy', function() { 
       btn.off('touchstart touchend click') 
      }); 
     } 
    } 
} 

Целью этого было создание элемента формы выбора номера для семантического интерфейса. Он работал отлично несколько дней назад. И эта ошибка настолько расплывчата, что я даже не могу с чего начать. Я упоминал, что я угловатый noob?

Ошибка:

Error: [$compile:nonassign] Expression 'undefined' used with directive 'numberPicker' is non-assignable! 

Answer 1

Как использовать директиву? В соответствии с определением вам необходимо установить оба атрибута «значение» и «ng-model». Например:

<number-picker value="xyz" ng-model="abc"></number-picker> 

Ошибка «Выражение„не определено“используется с директивой ...», как правило, выдается, если один из значений области видимости не установлен.