получить доступ к значениям SASS ($ colors от variables.scss) в Typescript (Angular2 ionic2)
В Ionic 2 я хотел бы получить доступ к$colors
переменные из файла "[мой проект] \ src \ theme \ variables.scss".
Этот файл содержит:
$colors: (
primary: #387ef5,
secondary: #32db64,
danger: #f53d3d,
light: #f4f4f4,
dark: #222,
favorite: #69BB7B
);
В компоненте я рисую холст. Это выглядит так:
import {Component, Input, ViewChild, ElementRef} from '@angular/core';
@Component({
selector: 'my-graph',
})
@View({
template: `<canvas #myGraph class='myGraph'
[attr.width]='_size'
[attr.height]='_size'></canvas>`,
})
export class MyGraphDiagram {
private _size: number;
// get the element with the #myGraph on it
@ViewChild("myGraph") myGraph: ElementRef;
constructor(){
this._size = 150;
}
ngAfterViewInit() { // wait for the view to init before using the element
let context: CanvasRenderingContext2D = this.myGraph.nativeElement.getContext("2d");
// HERE THE COLOR IS DEFINED AND I D LIKE TO ACCESS variable.scss TO DO THAT
context.fillStyle = 'blue';
context.fillRect(10, 10, 150, 150);
}
}
Как можно видеть, в какой-то момент в этом коде определяется цвет фигуры:context.fillStyle = 'blue'
Я хотел бы использовать вместо этого что-то вродеcontext.fillStyle = '[variables.scss OBJECT].$colors.primary '
.
У кого-нибудь есть идея?