Angular2材料传递垫选择为提交时的模型

我需要在submit上传递表单的模型，模型的一个元素是select选项。 如何在Submit上同时传递值和selectionName

Html:

<form #EditUserForm="ngForm" (ngSubmit)="onSubmit(EditUserForm)">

 <mat-form-field class="container">
    <mat-select [value]="currentUserRole.RoleId" name="RoleId" required >
      <mat-option  *ngFor="let role of roles" [value]="role.RoleId">{{role.RoleName}}</mat-option>
    </mat-select>
 </mat-form-field>

onSubmit(EditUserFormModel: NgForm) {
}

---

您可以使用双向绑定

 <mat-select [(value)]="currentUserRole.RoleId" name="RoleId" required >

这样，

currentUserRole.RoleId

将立即设置为用户在选择框中选择的任何内容

---

如果您想延迟绑定（例如，为了创建“重置”功能），您必须先复制，或者最好使用

ReactiveForms

。

不确定您的意思

值和选择名称

我猜值是currentUserRole.RoleId，selectionName是role.RoleName

那么

[value]=“currentUserRole.RoleId”>

值输入指定返回的值。如果您的值和selectionName都在currentUserRoleobject中，您可以传递它，而不是只传递要写入表单字段值的Id

[value]=“currentUserRole”>

但这也意味着您必须更改显示的文本并自定义显示的文本

在这里，您可以根据需要设置值

理想情况下，在提交时只需传递EditUserFormModel.value即可获得表单数据

---

听起来有点像你想在你的提交中抓住价值，我不鼓励。而是对表单进行建模，以输出提交时所需的所有值，并在那里处理提交本身。如有必要，挂接回调以修补事件的值。

这两个[（值）]=“currentUserRole.RoleId”和[（ngModel）]=“currentUserRole.RoleId”甚至都不会填充选择内容，仅[值]=“currentUserRole.RoleId”有效。。。但是它在提交时不会传递值，我还需要选择名称-currentUserRole.RoleNameokay我找到了为什么[（ngModel）]=“currentUserRole.RoleId”不起作用-类型中有一个错误-我的currentUserRole.RoleName的类型是number而不是string。在我将其更改为字符串后，它开始正确绑定currentUserRole.RoleId-现在我可以通过这种方式传递值。但是我可以通过某种方式传递RoleName（这是选择的名称）吗？或者，这应该在typescript中通过id获取RoleName来完成？如果需要，您可以将整个

角色

作为选择值传递。如果需要，对象可以是输入的值。

   <mat-select [(ngModel)]="currentUserRole.RoleId" name="RoleId" required >

<mat-form-field>
  <mat-select [value]="currentUserRole.RoleId" name="RoleId" required>
    <mat-select-trigger>
      {{currentUserRole.RoleName}}
    </mat-select-trigger>
    <mat-option  *ngFor="let role of roles" [value]="role.RoleId">{{role.RoleName}}</mat-option>
  </mat-select>
</mat-form-field>

<mat-select 
  [value]="currentUserRole.RoleId" 
  (selectionChange)="setValues($event, EditUserForm)"
  name="RoleId" 
  required 
  > 
      <mat-option  
          *ngFor="let role of roles" 
          [value]="role.RoleId">
            {{role.RoleName}}
      </mat-option>
</mat-select>

public setValues(event, form): void {
  form.patchValue({...})
}