Join GitHub today
GitHub is home to over 40 million developers working together to host and review code, manage projects, and build software together.
Sign updocs(chips): provide docs and demo for using a label with outline appearance #16292
Comments
This comment has been minimized.
This comment has been minimized.
|
Hello, @Splaktar don't know if is a bug actually, because it's work fine if the mat-label is outside the mat-chip-list. this work <mat-form-field>
<mat-label></mat-label>
<mat-chip-list>
<mat-chip></mat-chip>
<input>
</mat-chip-list>
<mat-autocomplete>
</mat-autocomplete>
</mat-form-field>but if we move the mat-label inside like that, the label don't have the correct render <mat-form-field>
<mat-chip-list>
<mat-chip></mat-chip>
<mat-label></mat-label>
<input>
</mat-chip-list>
<mat-autocomplete>
</mat-autocomplete>
</mat-form-field> |
This comment has been minimized.
This comment has been minimized.
|
This is certainly a hole in our documentation. As you found, the Thank you for pointing this out. |
This comment has been minimized.
This comment has been minimized.
|
Pull request created #16578 |
mkonars
added a commit
to mkonars/components
that referenced
this issue
Jul 22, 2019
add an example with outline appearance, so it is clear where the label should be placed Fixes angular#16292
mkonars
added a commit
to mkonars/components
that referenced
this issue
Jul 22, 2019
add an example with outline appearance, so it is clear where the label should be placed Fixes angular#16292
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Bug, enhancement request, or proposal:
In mat-form-field with outline appearance you can insert a mat-chip-list inside the form-field but the label doesn't go above the input
it's look like a bug, because if we insert the mat-chip-list outside or if we change the appearance everything look good
CodePen and steps to reproduce the issue:
Stackblitz to see what i mean
https://stackblitz.com/edit/angular-dydyib
Detailed Reproduction Steps:
What is the expected behavior?
The label should go above the input like that

What is the current behavior?
The label stay in the input
What is the use-case or motivation for changing an existing behavior?
Which versions of AngularJS, Material, OS, and browsers are affected?
"@angular/material": "^6.3.2"
OS: MacOS Mojave
Browsers: Chrome Version 74.0.3729.169