Как заставить ui-маску возвращать модели $viewValue вместо $modelValue?

Я использую ui-mask для ввода, поэтому пользователь может ввести дату:

 <input type="text" ui-mask="19/39/2999" ng-model="inicio">

(1, 3 и 2 — это некоторые дополнительные маски, которые я добавил, поэтому он позволит только от 0 до 1, от 0 до 3 и от 2 до 3 соответственно)

Проблема в том, что я инициализирую ввод с помощью dateFilter на моем контроллере.

 $scope.inicio = dateFilter((new Date), 'MM/dd/yyyy')

Ввод показывает правильное значение текущей даты, например 06/13/2013. Проблема в том, что когда я изменяю ввод на 05/13/2013, модель $scope.inicio будет содержать 05132013 (вообще без форматирования), и я понятия не имею, как заставить ее использовать $viewValue вместо $modelValue, можно ли это сделать?


person pocesar    schedule 13.06.2013    source источник
comment
Ответ здесь stackoverflow.com/questions/17116730/   -  person pocesar    schedule 25.06.2013


Ответы (1)


Что я сделал, так это просто добавил атрибут, чтобы контролировать, используете ли вы viewValue или Value.

А изменение скриптов совсем не проблема, для этого требуется около 5 строк кода.

Вот как:

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

Сначала добавьте переменную в начало

return function uiMaskLinkingFunction(scope, iElement, iAttrs, controller){
    var maskProcessed = false, eventsBound = false,
    maskCaretMap, maskPatterns, maskPlaceholder, maskComponents,
    //... Ton of varaibles...

    var useViewValue; // <----- ADD THIS

Позже в коде вы найдете функции Formatter и Parser:

      function formatter(fromModelValue){
        /*formatter code*/
      }

      function parser(fromViewValue){
        // parser code...
        if (value === '' && controller.$error.required !== undefined) {
          controller.$setValidity('required', false);
        }
        // ADD useViewValue code START
        if (useViewValue) 
            value = value.length ? maskValue(value) : '';
        // ADD useViewValue code END
        return isValid ? value : undefined;
      }

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

      iAttrs.$observe('uiMask', initialize);

      // ADD useViewValue code START
      iAttrs.$observe('uiMaskUseViewvalue', function (useVVal) {
          useViewValue = useVVal == 'true';
      });
      // ADD useViewValue code END
      iAttrs.$observe('placeholder', initPlaceholder);

Реализуйте это и в HTML

<input type="text" ui-mask="19/39/2999" ui-mask-use-viewvalue="true" ng-model="inicio">
person André Snede    schedule 29.01.2014
comment
да, но вместо того, чтобы возиться с кодом библиотеки, вы должны написать другую директиву, которая работает одновременно с ней напрямую, то есть создать директиву uiMaskUserViewvalue и применить ваши парсеры внутри этого - person pocesar; 30.01.2014
comment
@pocesar Я мог бы либо a. сделать это, и сесть на час или около того, чтобы это, вероятно, сработало, либо b. использовать 2 минуты, исправляя уже хороший маскировщик, чтобы иметь нужную мне функциональность. Я не работаю над хобби-проектом, каждая потраченная минута стоит денег. И изобретать велосипед не имеет никакого значения для бизнеса. - person André Snede; 30.01.2014
comment
@André Snede Hansen У меня ТОЧНО та же проблема, а этот код решил проблему. Мне любопытно, когда это изменение будет доступно на nuget.org/packages/Angular. .UI.Utils ????? Таким образом, мини-версия поставляется вместе с ним. - person DRobertE; 19.06.2014
comment
@denas Это все еще открытый запрос на включение: github.com/angular-ui/ ui-utils/pull/199 и это все, что я смог сделать. Если вам нужна эта функция, вам нужно зайти на GitHub и помочь включить ее в модуль. - person André Snede; 19.06.2014
comment
@denas Также, если вы просто хотите, чтобы он был минимизирован, вы можете легко сделать это самостоятельно, fx. с веб-основами. - person André Snede; 19.06.2014
comment
@André Snede Hansen Меня беспокоит то, что когда будет выпущена следующая версия angularui / angularui-utils, это вернется к краху, потому что для указания значения представления будет использоваться другой атрибут, то есть ... это не будет ui-mask- use-viewvalue больше. Используете ли вы webessentials для минимизации скрипта? Я заметил, что эти изменения, кажется, находятся в github, как опубликовано здесь github.com/Snede/ui -utils/коммит/ - person DRobertE; 19.06.2014
comment
@denas Я разделяю вашу озабоченность, и мы/я мало что можем сделать, если только они не примут запрос на включение. Изменения в ссылке предложены и сделаны мной, но они еще не приняты, и в данный момент у меня нет времени менять код на предлагаемые ими изменения. Но я приветствую любого, чтобы сделать это. - person André Snede; 19.06.2014
comment
@André Snede Hansen Спасибо за код. Как вы оцениваете изменения кода, которые они предложили, по сравнению с теми, которые вы сделали? - person DRobertE; 19.06.2014
comment
Они только что написали то, что, по их мнению, должно быть по-другому, я еще не изменил код, это все ветки в ссылке, которую я вам дал. - person André Snede; 19.06.2014
comment
@André Snede Hansen modelViewValue находится в вашей кодовой базе, и этот атрибут на самом деле уже делает то, что вы пытаетесь сделать в приведенном выше коде, и эти изменения, похоже, находятся в основной ветке. Спасибо за вашу помощь! - person DRobertE; 19.06.2014