Angular 8: пометить форму как прикосновенную к родительскому компоненту

Question

Как объявить метку формы дочернего компонента, прикоснутую к родительскому компоненту?

В настоящее время в дочернем компоненте есть переменная ввода и ngOnChanges, которая работает

@Input public markFormTouchedFlag: boolean

if (this.markFormTouchedFlag) { 
    this.addressform.markAllAsTouched();
}

Curious, Если есть более эффективный способ сделать дочерний компонент формы (адресной формы), как это происходит из родительского компонента?

Может быть, следует сделать вопрос более универсальным c, найти правильность формы, нетронутым, но я остановлюсь сначала только вопрос.

Answer 1

Вы можете сделать это более импровизированным способом, если вам нужно передать одну и ту же переменную ("markFormTouchedFlag") нескольким компонентам, которые вы можете использовать этим методом. Этот метод, хранящий данные в наблюдаемой и подписывающийся на это, обновит переменную auto, где бы она ни использовалась.

create service для хранения данных:

import { Injectable } from '@angular/core';
import { Observable, Subject } from 'rxjs';

@Injectable({ providedIn: 'root' })
export class FlagService {
    private subject = new Subject<any>();

    updateFlag(flag: bool) {
        this.subject.next({ flag: flag });
    }

    clearFlag() {
        this.subject.next();
    }

    getFlag(): Observable<any> {
        return this.subject.asObservable();
    }
}

create parent component:

import { Component, OnDestroy } from '@angular/core';
import { Subscription } from 'rxjs';

import { FlagService } from '../services/FlagService.service';

@Component({
    selector: 'app',
    templateUrl: 'app.component.html'
})

export class AppComponent implements OnDestroy {
    flag: any;
    subscription: Subscription;

    constructor(private flagService: FlagService) {}

    setFlag(): void {
     this.flagService.sendFlag(flag);
   }

   clearFlag(): void {
       this.messageService.clearMessage();
   }
}

В этом компоненте (родительском компоненте) у нас установлены две функции и флаг очистки. Setflag Функция используется для установки значения в сервисе. как только это установлено в слое сервиса, где когда-либо подписано значение, оно будет обновлено. clearFlag функция используется для установки переменной с нулевым значением.

дочерний компонент:

import { Component } from '@angular/core';

import { FlagService } from '../services/FlagService.service';

@Component({ templateUrl: 'home.component.html' })
export class HomeComponent {

 flag: any;
 subscription: Subscription;

 constructor(private flagService: FlagService) {
     this.subscription = this.flagService.getMessage().subscribe(flag => { this.flag = flag; });
 }

 ngOnDestroy() {
     this.subscription.unsubscribe();
 }

Таким образом, вы можете получить значение из наблюдаемого, всякий раз, когда флаг изменяется в сервисе, он автоматически обновляется в дочернем компоненте, как только он изменяется в родительском компоненте, и для него устанавливается флаг в компоненте из-за подписки, сделанной в конструкторе.

для компонента уничтожить мы отписываемся по стоимости.