Angular Js在焦点上输入掩码

Question

我有电话号码输入掩码的工作指令

.directive('phonenumberDirective', ['$filter', function($filter) {

  return {
    restrict: 'E',
    scope: {
      phonenumberPlaceholder: '=placeholder',
      phonenumberModel: '=model',
    },
    template: '<input ng-model="inputValue" type="tel" placeholder="702-123-1234" class="form-control">',
    link: function(scope, element, attributes) {
      scope.inputValue = scope.phonenumberModel;

      scope.$watch('inputValue', function(value, oldValue) {

        value = String(value);
        var number = value.replace(/[^0-9]+/g, '');
        scope.phonenumberModel = number;
        scope.inputValue = $filter('phonenumber')(number);
      });
    }
  };
}]);

当用户输入702-123-1234时，它将屏蔽数字。如何在焦点输入框中显示 - -____？ 请在附件中找到预期的输出