Маскировка телефона в Ember JS - PullRequest
0 голосов
/ 03 августа 2020

Я пытаюсь замаскировать номер телефона в поле ввода, может ли кто-нибудь помочь мне в этом отношении. Вот мой код для html (или .hbs файла)

        <label class="control-label">Phone</label>
        {{masked-input mask='(999) 999-9999' 
                       value=model.Address.Phone 
                       input-format='regex' 
                       input-filter='\(*[0-9]{3}\) [0-9]{3}-[0-9]{4}' 
                       input-filter-message='Phone number is not valid.' 
                       class='form-control phone masked' 
                       maxlength="14"}}
    </div>

И определение моего компонента следующее:

export default () => {
    IMS.registerComponent("masked-input", {
        tagName: 'input',
        attrParams: ['required', 'title', 'name', 'placeholder'],
        loaded: false,
        prop: Ember.observer(
            'required',
            'title',
            'name',
            'placeholder',
            'value',
            function () {
                var scope = this;
                $(this.element).val(Ember.get(scope, 'value'));
                var stamp = new Date();
                if (Ember.get(scope, 'loaded') == true) {

                    var element = $(this.element);
                    var attrs = Ember.get(this, 'attrParams');
                    attrs.forEach(function (attr) {
                        var value = Ember.get(scope, attr);
                        if (value == '' | value == null) {
                            element.removeAttr(attr);
                        } else {
                            element.attr(attr, value);
                        }
                    })
                }
            }),
        observeMask: Ember.observer('mask', function () {
            var scope = this;
            $(this.element).inputmask({
                mask: Ember.get(scope, 'mask')
            });
        }),
        didInsertElement: function () {
            var scope = this;

            setTimeout(function () {
                var value = Ember.get(scope, 'value');
                var element = $(scope.element);
                var change = function () { Ember.set(scope, 'value', element.val()); }
                element.val(Ember.get(scope, 'value'));
                element.attr('type', 'text');
                element.change(change);
                Ember.set(scope, 'loaded', true);
                scope.observeChanges();
                element.inputmask({
                    mask: Ember.get(scope, 'mask')
                });    
                element.attr('input-format', Ember.get(scope, 'input-format'));
                element.attr('input-filter', Ember.get(scope, 'input-filter'));
                element.attr('input-filter-message', Ember.get(scope, 'input-filter-message'));    
            }, 250);
        }
    })
}
...