我想禁用一個按鈕,直到輸入欄位有資料。我試圖用下面的代碼來實作這一點。
<ion-row>
<ion-input clear-input
id="globalmsg-user-management-name"
#nameInput>
</ion-input>
</ion-row>
<ion-row>
<ion-button
#globalmsgAddButto
id="globalmsg-user-management-add-button"
(click)="addButtonClicked()"
[disabled]="addButtonDisabled()"
>
<span>Add</span>
</ion-button>
</ion-row>
@ViewChild('nameInput') nameInput: ElementRef;
addButtonDisabled()
{
if ( this.nameInput.nativeElement.value === '') {
return true;
}
else {
return false;
}
}
但我收到以下錯誤“無法讀取未定義的屬性‘nativeElement’”。我可以在 addButtonClicked() 中訪問 this.nameInput,但不能在 addButtonDisabled() 中訪問。有人可以回答這個問題嗎?
uj5u.com熱心網友回復:
你應該把 static: true 放到 ViewChild 中。默認情況下它是假的。
定義:
static - 在更改檢測運行之前決議查詢結果為真,在更改檢測后決議為假。默認為假。
@ViewChild('nameInput', {static: true}) nameInput: ElementRef;
所以 nameInput 應該在 ngOnInit 上可用。
為了安全起見,您還應該使用 safeCheck。
可選:最好更改方法名稱以獲得更好的約定,例如 isAddButtonDisabled。
public isAddButtonDisabled(): boolean {
if (this.nameInput?.nativeElement?.value === '') {
return true;
} else {
return false;
}
}
轉載請註明出處,本文鏈接:https://www.uj5u.com/yidong/411203.html
標籤:
