2015-12-11 4 views
2

У меня есть настраиваемая директива, которая принимает ввод текста типа, форматирует ввод и не позволяет пользователю вводить алфавиты (только цифры). Парсер отлично работает с незначительной ошибкой. Если я сначала попытаюсь ввести алфавит, это не позволяет мне правильно, но второй раз он позволяет мне вводить и не запускать функцию парсера. Может кто-нибудь скажет мне, где моя ошибка?Угловой парсер не запускается второй раз

ctrl.$formatters.unshift(function (a) { 
      return $filter(attrs.format)(ctrl.$modelValue) 
     }); 
ctrl.$parsers.unshift(function (viewValue) { 
      var plainNumber = viewValue.replace(/[^\d|\-+|\.+]/g, ''); 
      elem.val($filter(attrs.format)(plainNumber)); 
      return plainNumber; 
     }); 

Демонстрация: https://jsfiddle.net/t96fkuu7/5/.

ответ

0

В вашем синтаксическом анализе не обращайтесь непосредственно к элементу - пусть ngModelController сделает вашу работу!

Таким образом, вместо

elem.val($filter(attrs.format)(plainNumber)); 

Проверьте, что-то изменилось, и сказать ngModelController, чтобы идти ...

if (plainNumber != viewValue) { 
    ctrl.$setViewValue(plainNumber); 
    ctrl.$render(); 
} 
+0

Благодарим вас за предложение. Я могу использовать ngModelController, но он имеет массив с одним элементом в нем, если мне нужно получить доступ к $ setViewValue. У меня есть ngModelController [0], что кажется мне странным. Можете ли вы сказать, почему у меня есть массив? – Aj1

+0

Является ли jsfiddle вашим реальным кодом? Если нет - опубликуйте свой реальный код ... Потому что я попробовал его со своей скрипкой, он определенно работает: см. Https://jsfiddle.net/t96fkuu7/9/ –

+0

Что вы подразумеваете под моим реальным кодом? Скрипка отлично работает, но если вы попробуете сценарий, о котором я упоминал, вы можете воспроизвести ошибку. – Aj1

1

Упор форматирования значения DOM модели крупным в виде текста, пользователь вводит это на ngModelController's $parsers, это конвейер, через который будет передаваться viewValue при изменении ввода через DOM.

Для этого вам необходимо вручную установить свойство $viewValue на контроллере модели и вызвать $render для обновления DOM.

// in your directive's link function 
ctrl.$parsers.unshift(function (viewValue) { 
    var plainNumber = viewValue.replace(/[^\d|\-+|\.+]/g, ''); 

    ctrl.$viewValue = $filter('number')(plainNumber); 
    ctrl.$render(); 

    // return the modelValue 
    return plainNumber 
} 

Вот обновленный рабочий пример: https://jsfiddle.net/17k7em04/

Примечания Вы не должны вызывать $setViewValue изнутри $parsers, это вызовет бесконечный цикл в более ранних версиях Углового, поскольку он вызывает функцию $ парсеров.

Смежные вопросы