В Angular 2+ вы можете использовать `getComputedStyle` для получения стилей элемента и из них извлекать значения переменных SCSS.
Вот пример кода, который позволяет получить значения переменных SCSS из класса `.my-element`:
```javascript
import { Component, AfterViewInit, ElementRef } from '@angular/core';
@Component({
selector: 'my-component',
template: `
<div class="my-element"></div>
`,
styles: [`
.my-element {
background-color: $myColor;
font-size: $myFontSize;
// и другие переменные SCSS...
}
`]
})
export class MyComponent implements AfterViewInit {
constructor(private elementRef: ElementRef) {}
ngAfterViewInit() {
const element = this.elementRef.nativeElement.querySelector('.my-element');
const styles = window.getComputedStyle(element);
// Получаем значение переменных SCSS
const myColor = styles.getPropertyValue('--myColor');
const myFontSize = styles.getPropertyValue('--myFontSize');
console.log(`myColor: ${myColor}`);
console.log(`myFontSize: ${myFontSize}`);
}
}
```
В данном примере, переменные SCSS `$myColor` и `$myFontSize` используются для стилизации класса `.my-element`. Они извлекаются с помощью `getPropertyValue` из объекта `styles`, который был получен с помощью `getComputedStyle`.
Удостоверьтесь, что вы объявили все переменные SCSS в соответствующем файле стилей, иначе вы не сможете получить их значения.