出于一些奇怪的原因,在线没有任何教程或代码示例显示如何使用Angular2 Reactive表单,而不仅仅是简单的输入或选择下拉列表.
我需要创建一个表单让用户选择他们的头像.(图像文件)
以下不起作用.(即"头像"属性从不显示任何值更改.)
profile.component.html:
<form [formGroup]="profileForm" novalidate>
<div class="row">
<div class="col-md-4 ">
<img src="{{imgUrl}}uploads/avatars/{{getUserAvatar}}" style="width:150px; height:150px;float:left;border-radius:50%;margin-right:25px;margin-left:10px;">
<div class="form-group">
<label>Update Profile Image</label>
<input class="form-control" type="file" formControlName="avatar">
</div>
</div>
<div class="col-md-8 ">
<div class="form-group">
<label >Firstname:
<input class="form-control" formControlName="firstname">
</label>
</div>
<div class="form-group">
<label >Lastname:
<input class="form-control" formControlName="lastname">
</label>
</div>
<div class="form-group">
<label >Email:
<input class="form-control" formControlName="email">
</label>
</div>
<div class="form-group">
<label >Password:
<input class="form-control" type="password" formControlName="password">
</label>
</div>
</div>
</div>
</form>
<p>Form value: {{ profileForm.value | json }}</p>
<p>Form status: …Run Code Online (Sandbox Code Playgroud)