2016-12-11 5 views
0

Ich versuche, die Rahmenfarbe zu ändern, aber es ist nicht funktionieren.eckig 2 Inline-Stil borderColor funktioniert nicht

Es ist mein Code:

<div [style.backgroundColor]="item.color" [style.borderColor]="item.borderColor"> 

Und in der CSS-

display: inline-block; 
    margin: 2px; 
    border:2px solid ;//red; 
    height:25px; 
    width:25px; 
     border-radius:50%; 
    -moz-border-radius:50%; 
    -webkit-border-radius:50%; 

The background Arbeit, aber die Grenze nicht. Ich versuche auch:

[ngStyle]="{border: '2px solid(' + item.borderColor + ')'}" 

aber keine Wirkung.

+1

Es funktioniert gut https://plnrkr.co/edit/WKo9CfHF4eHc40ffNAaD?p=preview – yurzui

Antwort

0

Hier einige Lösung ist border-color dynamisch geändert zu machen -> In Ihrer ts Datei schrieb dies:

get myStyles(): any { 
    let color = 'red'; 
     return { 
      'border':'1px', 
      'border-style': 'solid', 
      'border-color':this.dtService.border_color 
     }; 
    } 

dann in der HTML-Datei -> ngstyle = "mystyles"

Dadurch wird Ihre Rahmenfarbe ändert sich dynamisch. Ich hoffe, dass dir das irgendwie hilft. Danke