網站搜尋

javascript - 在 Angular2 中傳遞被禁用的表單輸入值於提交時


我有一個表單,其中有一個電子郵件欄位。我正在使用 插值 來填充表單欄位的值。但我不希望使用者能更改表單欄位中的電子郵件地址。因此我在 輸入欄位 上添加了 disabled 標記。當我添加 disabled 時,表單無法將電子郵件傳送到 http post。

我如何才能禁用這個輸入欄位,但仍向使用者顯示電子郵件地址,讓它在表單與其他數據一起提交時仍會被提交?

<input type="text" class="form-control" id="email" [(ngModel)]="personal.email" name="email" #email="ngModel" required value="{{auth.userProfile.email}}" placeholder="{{auth.userProfile.email}}" disabled>

也許我對 雙向數據綁定 感到困惑,但我是否不能只是用類似這樣的方式添加值,

[(ngModel)]="personal.email"
=
{{auth.userProfile.email}}

那還要保持表單輸入欄位為禁用狀態嗎?

答案#1

<input type="text" class="form-control" id="email" [(ngModel)]="personal.email" name="email" #email="ngModel" required value="{{auth.userProfile.email}}" placeholder="{{auth.userProfile.email}}" readonly> 不要使用 disable。如果你想傳遞值,請使用 readonly (readonly="readonly")。這樣它會讓你提交該值。