javascript - 如何在Angular中清除组合框选定的值
问题描述
我有一个简单的 html 文件,其中包含 1 个组合框和 1 个清除按钮。我怎样才能使单击时清除组合框选定值的清除按钮。这是我的代码:
mat-card-content fxLayout="row wrap" fxLayoutAlign="left" fxLayoutGap="30px">
<mat-form-field fxFlex="30%">
<mat-select placeholder="Choose Employer"
[(ngModel)]="customModel"
#activeEmployers="ngModel"
required>
<mat-option *ngFor="let emp of employerList" [value]="emp.displayName">{{emp.displayName}}
</mat-option>
</mat-select>
</mat-form-field>
</mat-card-content>
<mat-card-actions>
<button type="button" class="get-button" (click)="getEmployers()">
CLEAR
</button>
</mat-card-actions>
</mat-card>
但是在这里,如果我使用
<button type="button" class="get-button" (click)="onClearSelected()">
CLEAR
</button>
并在 ts 文件中:
onclear(){this.employerList=null}
然后它清除组合框的所有选项。我怎样才能达到唯一选定的值并清除它?
解决方案
您需要清除 [(ngModel)] 的值。使用以下内容更改您的 onclear 功能
onclear(){this.customModel=null}
将雇主列表设置为未定义会清除您选择的选项。
推荐阅读
- python - forwardMessage 方法,只需要一些建议
- discord - 当用户加入服务器时,如何让我的机器人分配一个角色,然后在两分钟后将其移除?
- ios - Swift - 按值对 Array 的元素进行分组(2 乘 2、3 乘 3 等...)
- java - 基于人员类参数的优先队列
- excel - 运行时错误 424:需要对象。我错过了什么?
- asp.net - Asp.net core 2.1 Web App 无法在 IIS 上正确呈现
- javascript - scrollIntoView 函数不会滚动到任何地方
- reactjs - React:编译失败;index.js
- javascript - JavaScript 中的动画问题
- angularjs - angular 7 *ngFor 嵌套数组迭代