Angular imask не работает, когда значение компонента установлено для компонента - PullRequest
Новая
       2

Angular imask не работает, когда значение компонента установлено для компонента

0 голосов
/ 07 февраля 2020

У меня проблема. У меня есть проект с Angular CLI версии 7.3.6. Я использую angular -imask для форматирования некоторых входных данных. В этом случае маска angular работает неправильно.

Для формы, которую я использую FormGroup. При загрузке человека, как показано в коде, есть два случая, когда человек приходит из переменной, хранящейся в службе, или когда делается запрос на серверную часть. В обоих случаях, когда человек возвращается, this.pessoaForm.patchValue (this.pessoa) используется для установки полей этого человека во входных данных формы. Однако, если значение поля имеет формат «16893034108», то при установке его первым if (служебная переменная) значение при восстановлении из формы будет равно «16893034108». Однако, если значение поля исходит из внутреннего интерфейса (в соответствии с if), значение при восстановлении из формы получается как '(16) 89303-4108', ie с примененной маской. Я хочу, чтобы первый вариант также шел с примененной маской, и обе формы выполняются с помощью this.pessoaForm.patchValue (this.pessoa). Проблема похожа на эту ссылку

ссылка: https: //simb.github.io/textMaskDemo/

Кто-нибудь знает, является ли это ошибкой или необходимо выполнить какую-либо настройку? 

private loadPessoa() {
    if(this.pessoaService.getPersonGuarded()){
        this.pessoa = this.pessoaService.getPersonGuarded();
        this.pessoaService.setPersonGuarded(null)
        this.createFirstPerson = true

        if(!(this.currenctAction == 'novo')){
            this.disableCnpjOrCpf()
        }
        if(this.pessoa.empresa)
        {
            this.pessoaForm.get('cpf').disable()
            this.pessoaForm.get('cnpj').disable()
            this.pessoaForm.get('id_tipo_pessoa').disable()
            this.pessoaForm.get('id_empresa').disable()
        }

        this.pessoaForm.patchValue(this.pessoa);

        this.loadPersonFromPessoaService = true
    }
    else if (this.currenctAction == 'editar' || this.currenctAction == 'visualizar') {
        this.route.paramMap.pipe(
            switchMap(params => this.pessoaService.getById(params.get('uuid')))
        ).subscribe(
            (pessoa) => {
                this.pessoa = pessoa
                this.disableCnpjOrCpf()

                this.pessoaForm.patchValue(this.pessoa)

                this.enderecoListComponent.getAddresses(this.pessoa.id_pessoa)
                this.contatoListComponent.getContacts(this.pessoa.id_pessoa)
                this.midiaListComponent.getMidias(this.pessoa.id_pessoa)
            },
            (error) => alert(error)
        );
    }

    if(this.currentUser.id_empresa == ID_USER_ADMIN && !this.pessoa.empresa){
        this.pessoaForm.get('id_empresa').setValidators([Validators.required])
        this.pessoaForm.get('nome_empresa').setValidators([Validators.required])
        if(this.currenctAction == 'novo')
        {
            this.pessoaForm.get('id_empresa').setValue(this.currentUser.id_empresa)
            this.pessoaForm.get('nome_empresa').setValue(this.currentUser.nomeEmpresa)
        }
        this.pessoaForm.get('id_empresa').updateValueAndValidity()
        this.pessoaForm.get('nome_empresa').updateValueAndValidity()
    }
}

imaskFone = {
        mask: '(00) 0000-0000',
        placeholder: {
            show: 'always'
        }
    };
...