md-progress-circle angular2-materialのカスタムカラー

Question

私のmd-progress-circleオブジェクトの色を自分のカスタムカラーに変更しようとしています。

<md-progress-circle mode="determinate"></md-progress-circle> 

どうすればいいですか？重複または上書きするクラスはありません。

export function CustomComponent(annotation: any) { 
    return function (target: Function) { 
    var parentTarget = Object.getPrototypeOf(target.prototype).constructor; 
    var parentAnnotations = Reflect.getMetadata('annotations', parentTarget); 

    var parentAnnotation = parentAnnotations[0]; 
    Object.keys(parentAnnotation).forEach(key => { 
     if (parentAnnotation[key] !== undefined && parentAnnotation[key] !== null) { 
     if(Array.isArray(parentAnnotation[key])) { 
      annotation[key] = [...parentAnnotation[key], ...annotation[key]]; 
     } else { 
      annotation[key] = parentAnnotation[key]; 
     } 
     } 
    }); 
    var metadata = new ComponentMetadata(annotation); 
    Reflect.defineMetadata('annotations', [ metadata ], target); 
    } 
} 

@CustomComponent({ 
    styles: [` 
    :host path { 
     stroke: red; 
    } 
    `] 
}) 
export class CustomMdProgressCircle extends MdProgressCircle { 
    constructor(_changeDetectorRef: ChangeDetectorRef) { 
    super(_changeDetectorRef); 
    } 
} 

私が作成したカスタムコンポーネントCustomMdProgressCircleあなたがそれを使用する必要がその後の原点MdProgressCircle が上書きされます：あなたはスタイルをこのように上書きしようとすることができ

styles: [ 
    ... 
    :host path { 
     fill: transparent; 
     stroke: #00897b; 

     /** Stroke width of 10px defines stroke as 10% of the viewBox */ 
     stroke-width: 10px; 
    } 
    ... 
] 

Answer 1

：progress-circle.jsで 私はこのラインを見つけましたこのように：

directives: [CustomMdProgressCircle] 

ここにplunkrのサンプルがありますhttps://plnkr.co/edit/1sROtfRVOOfnpa5C9HFw?p=preview

希望します！角度2（及び資料2）で

Answer 2

：それはSVG要素であることから、あなたはちょうどそのようにそのCSSスタイルを再定義することができます：

.mat-spinner path { 
    stroke: #cccccc; 
    stroke-width: 1px !important; 
}