Невозможно получить доступ к изменениям родительского объекта formControl в отношении Parent-Child Component в Angular 8 - PullRequest
Новая
       38

Невозможно получить доступ к изменениям родительского объекта formControl в отношении Parent-Child Component в Angular 8

1 голос
/ 26 марта 2020

Я создал родительский компонент следующим образом: 

<form [formGroup] = "cardForm">
<app-inputvalidator [controls] = "cardForm.get('name')"></app-inputvalidator>  
</form>

Родительский файл ts 

import { Component, OnInit } from '@angular/core';
import { FormGroup, FormControl,Validators } from '@angular/forms';

@Component({
  selector: 'app-card-form',
  templateUrl: './card-form.component.html',
  styleUrls: ['./card-form.component.css']
})

export class CardFormComponent implements OnInit {
  nameFormControl ;

   cardForm =  new FormGroup({
    name: new FormControl('', [Validators.minLength(5),Validators.maxLength(25)])
  });



  constructor() {
   }

 ngOnInit(): void {
     this.nameFormControl = this.cardForm.get('name');
            }

}

Я передаю nameFormControls дочернему компоненту и обращаюсь к нему также в шаблоне следующим образом:

InputValidator.ts 

 import { Component, OnInit, Input } from '@angular/core';
 import { FormControl} from '@angular/forms';

 @Component({
  selector: 'app-inputvalidator',
  templateUrl: './inputvalidator.component.html',
  styleUrls: ['./inputvalidator.component.css']
})
 export class InputvalidatorComponent implements OnInit {
 @Input() controls: FormControl;

 constructor() {

 }

 ngOnInit(): void {
 }

}

Input Validator. html

  <input [formControlName] = "controls"  
  <br>
  <div>{{ controls.errors | json}}</div>

Проект успешно скомпилирован без ошибок.

Я получаю значение control.errors всегда равным нулю. Почему я не могу напечатать объект controls.errors с использованием интерполяции строк при изменении значения в поле ввода имени?

1 Ответ

2 голосов
/ 26 марта 2020

вы получаете ноль, потому что вы не указали требуемый валидатор, валидаторы min, maxLength вернут ошибку, если есть значение и значение недопустимо, если значение равно нулю или пусто строка, которая будет считаться действительной

проверить валидатор ? source

...