Angular Material 2 Select 错误未显示在控件下方

贸发局

角 4.4.4

角材料 2.0.0-beta.12

我创建了一个包含以下mat-select元素的模板驱动表单

<mat-form-field class="add-task-full-width">
    <mat-select matInput
                [(ngModel)]="taskForCreation.areaId"
                id="areaControl"
                #areaControl="ngModel"
                name="areaControl"
                required
                (ngModelChange)="onAreaChanged($event)"
                placeholder="Area">
        <mat-option *ngFor="let area of areas" [value]="area.id">
            {{ area.description }}
        </mat-option>
        <mat-error *ngIf="areaControl.hasError('required')">
            Area is <strong>required</strong>
        </mat-error>
    </mat-select>
</mat-form-field>

如果我在没有从列表中选择项目的情况下跳出该字段,控件会变为红色并变为无效,但错误消息显示在列表底部,而不是控件下方。无论我尝试什么,我都无法改变这一点。

谁能看到我哪里出错了?

屋大维·马库列斯库

mat-error元素应放置在 的外部mat-select和内部mat-form-field请查看 的表单域功能MatSelect获取有关如何在表单域中使用它的更多信息。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

不显示Angular Material md-select的错误

来自分类Dev

ngModel 值未显示在 angular2 的控件中

来自分类Dev

Angular Material md-select验证问题

来自分类Dev

编译入口点@ angular / material / select失败

来自分类Dev

如何在Angular 2的select控件中显示占位符(空选项)?

来自分类Dev

Angular Material md-select 在预填充时不显示值

来自分类Dev

./node_modules/@angular/material/esm2015/select.js中的错误

来自分类Dev

Angular 2-TypeScript:如何使用<Select>控件保存对象

来自分类Dev

Angular 2-TypeScript:如何使用<Select>控件保存对象

来自分类Dev

Angular2 / Material2-未捕获的SyntaxError:意外的令牌导入

来自分类Dev

Angular2 / Material2-未捕获的SyntaxError:意外的令牌导入

来自分类Dev

ngx-translate with angular material 2 MdSnackBar

来自分类Dev

Angular Material 2 进度条叠加

来自分类Dev

Angular Material的<md-select>无法正确渲染

来自分类Dev

使用 Angular Material Select 和 Reactive Forms 访问输入

来自分类Dev

angular 2/4/5 Material:如何获得多选下拉列表的未选中值

来自分类Dev

Angular Material 2:在函数中显示新创建的数组时遇到问题

来自分类Dev

内容未显示:Angular 2

来自分类Dev

Angular Material单选按钮模型未更新

来自分类Dev

Angular 2 Material 2单选按钮的默认选择

来自分类Dev

Angular 2 Material 2单选按钮的默认选择

来自分类Dev

Angular 2 / Material 2无法实现选择组件

来自分类Dev

如何设置angular 2 material design 2.0.0-beta.2

来自分类Dev

Angular Material 6 不显示表单样式

来自分类Dev

Angular Material - 输入字段 - 显示重复字段

来自分类Dev

Angular 2 Material 2 Slide Toggle似乎无法在Alpha 7中工作错误:找不到名称“ HammerInput”

来自分类Dev

jQuery Select 2未显示所选值

来自分类Dev

Angular Material下拉标签未使用Angular Translate更新

来自分类Dev

Angular Material DatePicker日历显示在Angular Modal后面

Related 相关文章

  1. 1

    不显示Angular Material md-select的错误

  2. 2

    ngModel 值未显示在 angular2 的控件中

  3. 3

    Angular Material md-select验证问题

  4. 4

    编译入口点@ angular / material / select失败

  5. 5

    如何在Angular 2的select控件中显示占位符(空选项)?

  6. 6

    Angular Material md-select 在预填充时不显示值

  7. 7

    ./node_modules/@angular/material/esm2015/select.js中的错误

  8. 8

    Angular 2-TypeScript:如何使用<Select>控件保存对象

  9. 9

    Angular 2-TypeScript:如何使用<Select>控件保存对象

  10. 10

    Angular2 / Material2-未捕获的SyntaxError:意外的令牌导入

  11. 11

    Angular2 / Material2-未捕获的SyntaxError:意外的令牌导入

  12. 12

    ngx-translate with angular material 2 MdSnackBar

  13. 13

    Angular Material 2 进度条叠加

  14. 14

    Angular Material的<md-select>无法正确渲染

  15. 15

    使用 Angular Material Select 和 Reactive Forms 访问输入

  16. 16

    angular 2/4/5 Material:如何获得多选下拉列表的未选中值

  17. 17

    Angular Material 2:在函数中显示新创建的数组时遇到问题

  18. 18

    内容未显示:Angular 2

  19. 19

    Angular Material单选按钮模型未更新

  20. 20

    Angular 2 Material 2单选按钮的默认选择

  21. 21

    Angular 2 Material 2单选按钮的默认选择

  22. 22

    Angular 2 / Material 2无法实现选择组件

  23. 23

    如何设置angular 2 material design 2.0.0-beta.2

  24. 24

    Angular Material 6 不显示表单样式

  25. 25

    Angular Material - 输入字段 - 显示重复字段

  26. 26

    Angular 2 Material 2 Slide Toggle似乎无法在Alpha 7中工作错误:找不到名称“ HammerInput”

  27. 27

    jQuery Select 2未显示所选值

  28. 28

    Angular Material下拉标签未使用Angular Translate更新

  29. 29

    Angular Material DatePicker日历显示在Angular Modal后面

热门标签

归档