angular / angular/components

md error: long error messages overlap input fields

オープン
#4,580 コメント 39 件 リアクション 38 件 担当者 0 名 GitHub で見る
area: material/form-field area: material/input needs: discussion P4
主要言語
TypeScript
スター
25k
フォーク
6.8k
平均マージ
1日 8時間
マージ済み PR(30日)
91

説明

#### Bug, feature request, or proposal:
Bug (or question about) displaying long error messages in md-error

#### What is the expected behavior?
The error message needs to be visible without overlapping with other input fields

#### What is the current behavior?
If there are multiple error messages or if a message is too long it is displayed on top of the next input field

#### What are the steps to reproduce?
The plunk displays an example of a long error message for Last name, which is required, overlapping Email input field and 'Save' button on blur event: http://plnkr.co/edit/LX2iSTxWPJOvNVl0pzy8

#### What is the use-case or motivation for changing an existing behavior?
Long error messages in input form need to be displayed correctly

#### Which versions of Angular, Material, OS, TypeScript, browsers are affected?
+-- @angular/animations@4.1.2
+-- @angular/cli@1.0.3
+-- UNMET PEER DEPENDENCY @angular/common@4.1.2
+-- @angular/compiler@4.1.2
+-- @angular/compiler-cli@4.1.2
| +-- @angular/tsc-wrapped@4.1.2
+-- UNMET PEER DEPENDENCY @angular/core@4.1.2
+-- @angular/flex-layout@2.0.0-beta.8
+-- @angular/forms@4.1.2
+-- @angular/http@4.1.2
+-- @angular/material@2.0.0-beta.5
+-- @angular/platform-browser@4.1.2
+-- @angular/platform-browser-dynamic@4.1.2
+-- @angular/router@4.1.2
| +-- @angular/core@2.4.10

| +-- typescript@2.2.2
| `-- typescript@1.8.10
+-- typescript@2.3.2

コントリビューションガイド

コントリビューションガイドを開く

調査の方向性

md-error コンポーネントのエントリポイントから開始し、リンク先の Plunk で Last name の長いエラーを、複数のメッセージと blur イベントを含めて再現します。Email フィールドと Save ボタンの周辺におけるコンポーネントのレイアウト動作を追跡します。長いエラーメッセージが、隣接する入力フィールドに重ならずに表示されたままになれば完了です。

索引モデルが issue の本文から書いたものです。

評価

技術スタック
angular, typescript
領域
frontend
issue の種類
バグ
難易度
3/5
見積もり時間
1〜2日
活発さ
停滞
明瞭さ
おおむね明確
初心者へのやさしさ
42/100

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。