javascript - md-select Angular Material 中的错误消息触发器

标签 javascript angular angular-material

我有一个 md-select 和一个相应的提交按钮,我用它来调用 Web 服务并从 md-select 传递数据(我没有使用任何此处填写表格):

<div class="col-8">
    <md-select placeholder="Select User" class="custom-select" id="user" name="user" [(ngModel)]="user" floatPlaceholder="never">
        <md-option *ngFor="let user of users| keys" [value]="user.key">{{user.value}}</md-option>
    </md-select>
</div>
<div class="col-2 mb-3">
    <button type="button" class="btn blue-btn" (click)="ws(user)">View Details</button>
</div>

提交后和调用网络服务之前,我想检查是否已选择任何选项,并在没有选择的情况下显示错误消息( Angular Material 样式)。 Angular 文档提到了 mdInputerrorStateMatcher,但没有提到 md-select

最佳答案

利用ngModelChange

<md-select placeholder="Select User" class="custom-select" id="user" name="user" [(ngModel)]="user" floatPlaceholder="never" (ngModelChange)="changeSelected($event)">
        <md-option *ngFor="let user of users| keys" [value]="user.key">{{user.value}}</md-option>
    </md-select>

组件

changeSelected(event) {
  this.user = event.user;
}

关于javascript - md-select Angular Material 中的错误消息触发器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46149797/

相关文章:

javascript - 用jQuery获取声卡的输入声音

angular - 如何从 Angular 6的数组中调用数据

javascript - 在 .js 文件中获取 Angular 环境

angular - 具有 Blob 存储的 Azure CDN : WebContentNotFound when using Origin Path

javascript - 如何从 Webpack 的导出中排除 vendor 模块 peerDependencies?

javascript - 如何在 Angular 的 mat-button 中包装 mat-list-item

javascript - 如何从异步调用返回响应?

javascript - 未捕获的类型错误 : Cannot read property 'addEventListener' of null Angular 6

javascript - ArrayList 奇怪的问题

angular - CdkDragDrop 单元测试事件