Question

正如我在标题中提到的那样，当我通过单击按钮从两个输入字段中获取数据时，出现了控制台错误。

<mat-form-field class="col-sm-12">
        <mat-label>Enter email</mat-label>
        <input #fileInput1 [readonly]="isSignUpEmailChange" #mEmail matInput pattern="[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,3}$" [formControl]="signUpEmail"
            placeholder="Email" required>
        <mat-error *ngIf="signUpEmail.errors?.required">Please fill out this field</mat-error>
        <mat-error *ngIf="signUpEmail.errors&&signUpEmail.errors.pattern">Enter the valid email</mat-error>
    </mat-form-field>

<mat-form-field *ngIf="isNewMail" class="col-sm-12">
    <mat-label>Set password</mat-label>
    <input #mPassword #fileInput2 matInput placeholder="Password" [pattern]="selectedPattern" [formControl]="signInPassword" placeholder="Password"
        required>
    <mat-error *ngIf="signInPassword.errors?.required">Please fill out this field</mat-error>
    <mat-error *ngIf="signInPassword.errors&&signInPassword.errors.pattern">{{errorMgs}}</mat-error>
</mat-form-field>

此处＃fileInput1，＃fileInput2用于根据某些条件以编程方式单击此字段

@ViewChild('fileInput1') fileInput1: ElementRef;
@ViewChild('fileInput2') fileInput2: ElementRef;

delay(1000).then(_ => { this.fileInput1.nativeElement.click() });
delay(1000).then(_ => { this.fileInput1.nativeElement.click() });

在这里，我需要单击按钮获取电子邮件和密码值

<button
    (click)="signUp(mEmail.value,mPassword.value)"
    [disabled]="signInPassword.invalid"
    class="loginBtn"
    style="margin-left:15px;margin-right:15px;margin-top:10px"
    mat-raised-button color="warn"
>
Signup
</button>

Answer 1

使用隐藏代替 * ngIf 输入密码

ng如果从DOM中删除该元素，这就是为什么您可以访问 mPassword.value

喜欢

<mat-form-field [hidden]="!isNewMail" class="col-sm-12">
    <mat-label>Set password</mat-label>
        <input #mPassword #fileInput2 matInput placeholder="Password" [pattern]="selectedPattern" [formControl]="signInPassword" placeholder="Password"
                        required>
    <mat-error *ngIf="signInPassword.errors?.required">Please fill out this field</mat-error>
    <mat-error *ngIf="signInPassword.errors&&signInPassword.errors.pattern">{{errorMgs}}</mat-error>
</mat-form-field>

错误TypeError：无法读取未定义的属性“值”：角度6

1 个答案: