将默认值添加到文本输入角度2 [英] Adding Default Value To Text Input Angular 2

问题描述

背景

我的表单中包含用户电子邮件地址的输入字段。我使用插值将电子邮件添加到占位符字段。

问题

我不希望用户能够在此字段中更改电子邮件地址。我只希望他们能够看到它。但我确实希望它与表格一起发布。

问题

我一直在尝试不同的方式，无论表格不发布电子邮件。如何绑定它以便当表单时它实际上发布电子邮件地址已提交？

示例

我试过只读。这样他们就无法改变它。

 < input type =textclass =form-control id =email[（ngModel）] =personal.emailname =email#email =ngModelplaceholder ={{auth.user.email}}value ={{auth.user.email readonly> 
  

我试过没有 readonly 只是为了看看是否如果我不添加任何限制标记，它将起作用。

 < input type =textclass =form-control id =email[（ngModel）] =personal.emailname =email#email =ngModelplaceholder ={{auth.user.email}}value ={{auth.user。电子邮件}}> 
  

我知道电子邮件是可访问的，因为我将它添加到占位符字段并显示在形成。它不会发布。

解决方案

默认值是分配给 personal.email 的值。

或者你可以绑定到不同的属性

  [（ ngModel）] =personalEmail
  

并为 personalEmail <分配默认值/ code>并在代码中提交更新 persona.email 或使用

  [ngModel] =personalEmail（ngModelChange）=personal.email = $ event
  

从 personalEmail 获取初始值，并在发生更改时更新 personal.email

这可能也有效（未尝试）

  [ngModel] =personal.email || 'defaultValue'（ngModelChange）=personal.email = $ event
  

只能获得<$如果 personal.email null 'defaultValue' >

Background

I have a form with an input field containing the user's email address. I am using interpolation to add the email to the placeholder field.

Problem

I do not want the user to be able to change the email address in this field. I only want them to be able to see it. But I do want it to post with the form.

Question

I keep trying different ways and no matter what the form does not post the email. How can I bind it so that it will actually post the email address when the form is submitted?

Examples

I tried with readonly. That way they would not be able to change it.

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

I tried without readonly just to see if it would work if I do not add any restriction flags.

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

I know the email is accessible because I am adding it to the placeholder field and it shows up in the form. It just wont post.

解决方案

The default value will be the value assigned to personal.email.

Alternatively you can bind to a different property

[(ngModel)]="personalEmail"

and assign a default value to personalEmail and on submit update persona.email in code or use

[ngModel]="personalEmail" (ngModelChange)="personal.email = $event"

to get the initial value from personalEmail and update personal.email when changes happen

This might also work (not tried)

[ngModel]="personal.email || 'defaultValue'" (ngModelChange)="personal.email = $event"

to only get 'defaultValue' assigned if personal.email is null

这篇关于将默认值添加到文本输入角度2的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！