Support for placeholder when mask has optional characters

Author: Vinícius Fernandes de Jesus

modules/mask/mask.js

@@ -257,14 +257,15 @@ angular.module('ui.mask', [])
               minRequiredLength = 0;
 
               var isOptional = false,
+                  numberOfOptionalCharacters = 0,
                   splitMask  = mask.split('');
 
               angular.forEach(splitMask, function (chr, i){
                 if (linkOptions.maskDefinitions[chr]) {
 
                   maskCaretMap.push(characterCount);
 
-                  maskPlaceholder += getPlaceholderChar(i);
+                  maskPlaceholder += getPlaceholderChar(i - numberOfOptionalCharacters);
                   maskPatterns.push(linkOptions.maskDefinitions[chr]);
 
                   characterCount++;
@@ -274,6 +275,7 @@ angular.module('ui.mask', [])
                 }
                 else if (chr === '?') {
                   isOptional = true;
+                  numberOfOptionalCharacters++;
                 }
                 else {
                   maskPlaceholder += chr;

modules/mask/test/maskSpec.js

@@ -227,6 +227,13 @@ describe("uiMask", function () {
       expect(input.attr("placeholder")).toBe("MM/DD/YYYY");
     });
 
+    it("should ignore the '?' character", function() {
+      var placeholderHtml = "<input type=\"text\" ui-mask=\"99/99/9999 ?99:99\" placeholder=\"DD/MM/YYYY HH:mm\" ng-model=\"myDate\">",
+        input = compileElement(placeholderHtml);
+
+      scope.$apply("myDate = ''");
+      expect(input.attr("placeholder")).toBe("DD/MM/YYYY HH:mm");
+    });
 
   });