• Empleos
  • Sobre nosotros
  • profesionales
    • Inicio
    • Empleos
    • Cursos y retos
  • empresas
    • Inicio
    • Publicar vacante
    • Nuestro proceso
    • Precios
    • Evaluaciones
    • Nómina
    • Blog
    • Comercial
    • Calculadora de salario

0

73
Vistas
Angular 2 Material md-chips color attribute not working

When i try to style my md-chips with the color attribute nothing happens. According to the guide https://material.angular.io/components/component/chips this has to work. All my other elements style without problems.

<md-chip-list>
    <md-chip color="primary"> Chicken </md-chip>
    <md-chip color="warn"> Table </md-chip>
    <md-chip color="accent"> Tree </md-chip>
    <md-chip> Eight </md-chip>
</md-chip-list>

Result:enter image description here

Does anybody know how to fix this?

Thanks in advance!

about 3 years ago · Santiago Trujillo
3 Respuestas
Responde la pregunta

0

According to the plunkr example, the chips are only colored when the selected attribute is set to true :

<md-chip color="accent" selected="true">Chicken</md-chip>
about 3 years ago · Santiago Trujillo Denunciar

0

You can set the md-chip color dynamically by using ngStyle

<md-chip-list>
 <md-chip *ngFor="let item of itemList" [ngStyle]="{ backgroundColor: item.color }">
{{ item.name }}
</md-chip>
</md-chip-list>
about 3 years ago · Santiago Trujillo Denunciar

0

Right now (24 Sep 2017), this is not working. Even on the example in the docs isn't working

enter image description here

I was forced to use a CSS property:

<md-chip color="primary" [selected]="true" style="background-color: #986f37">Content here</md-chip>
about 3 years ago · Santiago Trujillo Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Nuestro proceso Comercial
Legal
Términos y condiciones Política de privacidad
© 2025 PeakU Inc. All Rights Reserved.

Andres GPT

Recomiéndame algunas ofertas
Necesito ayuda