Angular Material MatChipList MatError 在没有焦点的情况下设置 errorstate 时不可见

标签 angular angular-material angular-material2

我在芯片列表上显示 mat-error 时遇到了一些问题。根据this GitHub issue应显式设置 errorState 以显示 mat-error。

此解决方案工作正常,但仅当芯片列表具有焦点时才有效。当芯片列表未聚焦时,它不起作用。请参阅this example 。就我而言,当芯片列表没有焦点时,由于某些 API 调用,有效水果列表稍后会发生变化。

当chiplist没有焦点时如何显示mat-error?

最佳答案

设置 errorState似乎在没有焦点的情况下工作,由占位符和下划线转动指示 red .

我怀疑您需要 mat-error但是,要显示,您缺少 *ngIf .

<mat-error *ngIf="chipList.errorState">Too many chips</mat-error>

STACKBLITZ

https://stackblitz.com/edit/angular-matchiplist-with-error-message-tsdxfa?file=app/chips-input-example.html

关于Angular Material MatChipList MatError 在没有焦点的情况下设置 errorstate 时不可见,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/65356393/

相关文章:

javascript - 从 Angular 响应式(Reactive) FormArray 获取同级 AbstractControl - 自定义验证

Angular2路由器不渲染 View

Angular 2 Material MdSnackBar 无提供者

html - Angular Material 2导航栏到汉堡菜单

如果使用 formControlName, Angular Material 2 占位符会重叠值

angularjs - Angular 2 测试 - 组件状态在测试之间持续存在(即不重置)

javascript - Angular 2 和 google map API 的 typescript 逻辑问题

html - 使用 Angular 或 Angular Material 的 HTML 表格单元格内的垂直线和水平双向箭头

angular - 在 mat-checkbox 中停止 mat-select 的事件传播

javascript - 需要AngularJS/Javascript三元运算符代码解释