在文本框中输入日期时自动填写“/”

Question

要求：我在文本框中输入格式为mm / dd / yyyy的日期，当我输入月份时，“ / ”应自动填充空格在它之前和之后，并且在进入白天后同样如此。

我正在为此编写角度指令，第一部分非常简单，即生成“/”，但如何处理后退按钮和删除按钮。

当我删除或使用退格键时，文本框值减小并且“/”正在前移，但我希望它们的位置是固定的。当我在1,2,6,7位置使用退格键时，我试图插入空字符串，但这样就没有用了

指令代码：

app.directive('date', function() {
     return {
         restrict: 'A',
         link: function(scope, elem, attrs) {
             function setCursorPosition(ctrl, position) {
                 if (ctrl.setSelectionRange) {
                     ctrl.focus();
                     ctrl.setSelectionRange(position, position);
                 } else if (ctrl.createTextRange) {
                     var r = ctrl.createTextRange();
                     r.collapse(true);
                     r.moveEnd('character', pos);
                     r.moveStart('character', pos);
                     r.select();
                 }
             }

             function getCursorPosition(target) {
                 var cursor = 0;
                 if (document.selection) {
                     target.focus();
                     var range = document.selection.createRange();
                     range.moveStart('character', -target.value.length);
                     cursor = range.text.length;
                 } else if (target.selectionStart || target.selectionStart == '0')
                     cursor = target.selectionStart;
                 return cursor;
             }
             elem.on('keydown', function(e) {
                 var value = elem.val();
                 var l = value.length;
                 var code = e.which;
                 var result = false;
                 if (code < 48 || code > 57 || l > 14)
                     result = true;
                 if (code == 37 || code == 39)
                     result = false;

                 if (code == 8) {
                     var pos = getCursorPosition(elem[0]);
                     console.log(pos);
                     if (pos == 3 || pos == 4 || pos == 5)
                         result = true;
                     if (pos == 8 || pos == 9 || pos == 10)
                         result = true;
                     if (pos == 2 || pos == 1) {
                         result = false;
                         var str1 = value.substring(0, pos - 1);
                         console.log(str1);
                         var str2 = value.substring(pos);
                         value = str1 + " " + str2;
                         elem.val(value);
                         setCursorPosition(elem[0], pos);
                     }
                 }
                 if (result) {
                     e.preventDefault();
                     e.cancel = true;

                 }
             });

             elem.on('keyup', function(e) {
                 var code = e.which;
                 var value = elem.val();
                 var l = value.length;
                 if (l === 2 || l === 7)
                     elem.val(value + " " + "/" + " ");


             });
         }
     };
 });