如果文本框無效，隱藏按鈕

Question

我有一個文本框，它有一個電子郵件模式，我想隱藏一個跨度（點擊），如果模式失敗。這裏是我有我認爲應該工作

<input type="text" placeholder="Signup for Mailing List" #userEmail="ngModel" style="width:300px" name="email" [(ngModel)]="email" pattern="^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$" required email> 
    <span (click)="signup()" class="fa fa-envelope-o" *ngIf="userEmail.touched && !userEmail?.valid" style="position: relative;z-index: 1;cursor:pointer;left: -35px;width: 0; color:gray"></span> 

這是* ngIf錯了嗎？按鈕從不顯示

Answer 1

<input type="text" placeholder="Signup for Mailing List" 
     #userEmail="ngModel" style="width:300px" 
     name="emails" [(ngModel)]="emails" 
     pattern="^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$" required email> 
<span (click)="signup()" class="fa fa-envelope-o" 
     *ngIf="userEmail.touched && userEmail?.valid" // remove the !sign 
     style="position: relative;z-index: 1;cursor:pointer;left: -35px;width: 0; color:gray"></span> 

希望這是你在找什麼。