I'm working on a form with an email field that I want to populate using interpolation. However, I also want to prevent users from changing the email address once it's displayed. To achieve this, I tried adding the disabled attribute to the input field. But then, the email doesn't get passed in the HTTP POST request when the form is submitted.
Is there a way to disable the input field while still displaying the email address so that it gets included in the form data upon submission?
<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>
I might be misunderstanding two-way data binding, but can't I simply assign the value like this and keep the input field disabled:
[(ngModel)]="personal.email"
=
{{auth.userProfile.email}}
In conclusion, how can I ensure that the email address remains visible to the user, yet disabled for editing, and still gets submitted along with the rest of the form data?