angular / angular/components

[Mat-Form-Field] label/placeholder shake animation on input error

未关闭
#16,634 4 条评论 3 个 reaction 已指派 0 人 在 GitHub 查看
area: material/form-field feature P4
主要语言
TypeScript
星标
25k
派生
6.8k
平均合并
1 天 8 小时
30 天内合并 PR
91

描述

#### Feature Description

See the example in the official docs:
- [Material Design - Text Fields - Anatomy](https://material.io/design/components/text-fields.html#anatomy) > Assistive Elements > Error Text
- [Direct link to video example](https://storage.googleapis.com/spec-host/mio-staging%2Fmio-design%2F1563837804615%2Fassets%2F1-aJCEgnpvxTuvtYshKU7BuVV4EdPatjE%2Ftextfields-anatomy-error.mp4)

In a form field, on error, the label/placeholder lightly shakes (left and right) as it turns red.

#### Use Case

This will enhance form field UX by subtly grabbing user attention for errors during form field entry

贡献指南

打开贡献指南

调研方向

未指定实现文件或测试。首先定位 Angular Material form-field 组件,并在与链接的 Material Design 示例进行比较的同时复现其错误状态;当标签或占位符变红时轻微地左右摇晃,即表示完成。

由索引模型根据 Issue 内容生成。

评估

技术栈
angular, typescript
领域
design, frontend
Issue 类型
功能
难度
3/5
预计耗时
1-2 天
活跃度
停滞
描述清晰度
基本清楚
新手友好度
35/100

把新 issue 发到你的邮箱

精选适合新手参与的 GitHub issue 摘要。