使用formControlName属性的角反应形式输入不触发ngOnInit方法

时间:2019-11-29 11:47:02

标签: angular

我正在尝试制作可重用的输入组件。问题在于输入没有使用yarn add react-native-gesture-handler react-native-modal-dropdown react-native-vector-icons react-navigation npm install --save react-native-gesture-handler react-native-modal-dropdown react-native-vector-icons react-navigation 属性进行初始化。如果我在子组件(输入)上进行聚焦和散焦或在该输入中写东西,则将触发filter: drop-shadow(0px 3px 3px rgba(0,0,0,1)); 方法,此后一切都按需要进行,但是在我执行任何操作之前,无任何属性的纯输入我通过的已加载。如何立即传递formControlName属性?

父母TS:

ngOnInit

父HTML:

formControlName

儿童TS:

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

@Component({
  selector: "app-signup",
  templateUrl: "./signup.component.html",
  styleUrls: ["../user-auth-styles.scss"]
})
export class SignupComponent implements OnInit {
  signupForm: FormGroup;

  ngOnInit() {
    this.signupForm = new FormGroup({
      password: new FormControl(null, [
        Validators.required,
        Validators.minLength(8),
        Validators.pattern("(?=\\D*\\d)(?=[^a-z]*[a-z])(?=[^A-Z]*[A-Z]).{8,30}")
      ])
    });
  }

  onSubmit() {}
}

子HTML:

<div class="centered-content">
  <div class="white-box">
    <app-form-header [text]="'Sign up'"></app-form-header>

    <form [formGroup]="signupForm" (ngSubmit)="onSubmit()">

      <app-user-auth-control
        [formGroup]="signupForm"
        [formControlName]="'password'"
        [type]="'password'"
        [placeholder]="'Password'"
      ></app-user-auth-control>

      <app-submit-button [formGroup]="signupForm"></app-submit-button>
    </form>

    <app-form-info [page]="'signup'"></app-form-info>
  </div>
</div>

0 个答案:

没有答案