Questions tagged [md-chip]

Angular input-chips directive following Google Material Design guidelines.

input-chips directive following Google Material Design guidelines.

References:

48 questions
2
votes
0 answers

Using md-chips in forms with other inputs

I am trying to make use of md-chips alongside other inputs in a form that are inside md-input-containers. I have had to add my own css hacks to get the placeholder text of the input, plus padding and margin applied to get it to look as close enough…
mindparse
  • 6,115
  • 27
  • 90
  • 191
2
votes
1 answer

md-require-match and autofill md-chips

issue is To restrict md-chips to fill only by autocomplete options no other chip should allowed. any suggestions? ty in advance
thenil
  • 21
  • 3
2
votes
2 answers

mdChips with filter

I'm a Newbie to AngularJS trying something with Angular Material and need some ideas / help. I have icons of Font Awesome which are displayed with ng-repeat:
2
votes
1 answer

Autocomplete suggestions not shown after all chips removed (md-chips + md-autocomplete)

In my example (https://jsfiddle.net/vv18yjzo/7/) the autocomplete suggestions should be shown, as long as the md-chips input is focused. This works well when I enter a few items. However, when all available items are added and then removed, the…
2
votes
2 answers

ng-class on the angular material chips

I want to create some backlight for the chips which have an 'active' flag based on my key value type for which I have made a ng-class="{activeTag: $chip.active}" but it doesn't works. How to add this ng-class on dynamically created…
rkalita
  • 575
  • 4
  • 16
2
votes
1 answer

Angular Material md-autocomplete with md-chips doesn't clear search if blank

I am using md-autocomplete inside an md-chips. If I type 'a' and then select from the list, the control works correctly. however, if i don't type any search string and simply select from the list (because i want min-length=0), then the control…
1
vote
0 answers

material design dynamic chips with jquery - chipSetEl.appendChild is not a function

I'm trying to add tags when a user selects an option from a dropdown. So they can pick multiple items and there would then be tags underneath demonstrating the choices. My current attempt, trying to take from:…
user2363025
  • 6,365
  • 19
  • 48
  • 89
1
vote
0 answers

(AngularJs material) Make md-chips editable while Displaying an ordered set of objects as chips

I am using the md-chips component to add an object just like
Ahmed Ragab
  • 37
  • 1
  • 9
1
vote
1 answer

Default selected MatChips are not synced with MatChipList selected property

Default selected MatChips are not synced with MatChipList selected property Initial selected chips are empty eventhough Lime is selected. When we double click again Chip is getting added in selected but not initially. Demo here
divyameher
  • 134
  • 8
1
vote
1 answer

how to do validation in md-autocomplete+md-chip

I need to do validation in autocomplete like min length max length total number of chip I dint find a correct way to validate all these validations my HTML is
1
vote
0 answers

Material 2 md-chip Not Responsing to color Attribute

I can't seem to get my chip to respond to my color selection and I don't know why. Test It shows up but its always gray. My primary color has always worked for…
Hodglem
  • 614
  • 9
  • 17
1
vote
1 answer

Stacking md-chips vertically while keeping input on top

I have been trying out md-chips provided by angular and have been trying to stack them vertically. I looked at demos and also at this answer: Stack md-chips vertically angularjs The issue with that answer is that the input field keeps moving as more…
1
vote
1 answer

Angular Material - Autocomplete doesn't show suggestions when md-chips are closed

md-autocomplete doesn't show listed suggestions when the chips are closed, for varying list of suggestions. Scenario: I want to show suggestions only for the chips that are not added. Initially, all the chips are added, so there are no more chips…
kvn
  • 2,210
  • 5
  • 20
  • 47
1
vote
1 answer

How to implement ng-class to md-chip in angular-material

Here is my problem - i can't implement ng-class='{activeTag: $chip.active}' to . I've been tried to add this directive to but it doesn't works(because of $chip not in current scope). I also can add this…
rkalita
  • 575
  • 4
  • 16
1
vote
1 answer

how to add custom md-chips in addition to existing md-chips?

I have designed elements using angular material design . i have used md-chips for rendering skills data as bellow