如何使用模型的ngModel并允许其他选择和输入

Question

我有一个模型行：

export class Row {
    rowNumber: number;
    gender: string;
    firstName: string;
    lastName: string;
    emailAddress: string;
}

我在我的模板row.component.html中显示如下：

<div class="form-group row col-md-6 ">
    <label for="gender " class="col-sm-6 col-form-label ">Gender</label>
    <div class="col-sm-4 ">
        <input id="gender" class="form-control" [(ngModel)]="row.gender" />
    </div>
 </div> ...

现在允许用户更改模型。他可以通过在输入字段中输入内容来更改模型（这是可能的） 另一种选择应该是选择。如果用户点击输入字段，他应该能够选择一个选项。

(click)="getSelection('gender')"
(click)="getSelection('jobRole')"

row.component.ts：

getSelection(field:string){
...
return list; 
}

这怎么可能？ ngModel应该是row.gender。如何在这里将值分配给ngModel？

对于选择，我可以使用模态，但问题仍然是作业。

事先提前