我有一個子文本框組件 "app-ec-textbox"
app-ec-textbox 的 HTML
<input type="text" #txtBox [ngModel]="value" (focus)="validate(value)">
在 app-ec-textbox 的 ts 檔案中，我定義了如下函式validate()
@Input() value: string = "";
validate(val: string) {
console.log(val)
}
我在父組件中使用上面的子文本框組件，如下所示
<app-ec-textbox [value]="abc"></app-ec-textbox>
問題是當我單擊并將焦點設定在子文本框組件“app-ec-textbox”上時，我沒有在控制臺中獲得值“abc”。我希望在焦點事件中捕獲值“abc”。如何實作這一目標？
uj5u.com熱心網友回復：
您必須將其更改為焦點事件(focus)="validate($event)"
<input type="text" #txtBox [(ngModel)]="value" (focus)="validate($event)">
validate(event: any) {
console.log(event.target.value)
}
uj5u.com熱心網友回復：
當您將值傳遞給在[]您直接傳遞代碼中宣告的屬性時，為了清楚起見，我將舉一個例子：這個：
<app-ec-textbox [value]="abc"></app-ec-textbox>
它等于這個：
<app-ec-textbox value="{{ abc }}"></app-ec-textbox>
通過這種方式，您可以先評估一些代碼，然后將回傳的值傳遞給 prop。
你還沒有發布任何與一些被呼叫的道具相關的東西，abc所以接下來是 angular 試圖找到一個被呼叫的變數abc并將它的值傳遞給子道具。
如果你只想傳遞一個字串，你當然可以這樣做：
<app-ec-textbox [value]="'abc'"></app-ec-textbox> <!-- note the ' -->
但你可以：
<app-ec-textbox value="abc"></app-ec-textbox>
現在您將正確的值傳遞給孩子，您必須將屬性與 ng 模型系結，為此您可以使用雙向系結到值：
<input type="text" #txtBox [(ngModel)]="value" (focus)="validate(value)">
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/346332.html
標籤：有角的
上一篇：如何一次選擇一個單選按鈕
下一篇：在物體類中存盤多個地址欄位