Как изменять стили в Angular 2?

Question

[Владимир]

Доброго времени суток! Когда идёт объявление компонента (к примеру):

@Component({
  selector: 'quest-summary',
  template: `
    {{ someName }}
  `,
  styleUrls:  ['./quest-summary.component.css']
})

Интересует можно ли в Angular 2 использовать выражения типа "{{ someName }}" в стилях css которые подключаются с помощью styleUrls. На пример для управления некоторыми вещами по типу шрифтов, цвета и т.п. из админ панели, а не через код. Заранее спасибо за ответы!
P.S. ngClass и ngStyle не предлагать, интересует чисто выражения внутри css кода.

Comments

[Владимир]

Не правильно понял, в стилях нельзя использовать переменные да и не самое красивое это решение. Опишите саму проблему, возможнонайдется более правильное решение

Answer 1

[Ivan Stroykin]

Так делать нельзя. Если хотите, чтобы менялся внешний вид в зависимости от каких-то настроек пользователя, делается это так (как практический вариант):
в компоненте layout, который "обхватывает" все остальные компоненты пишете подстановочный класс, который будет меняться в зависимости от выбора пользователя. А в стилях пишите основные стили для всех + в зависимости от выбранного класса, то есть:

.selected-class-2 h1 {
  color: red;
}

Таких классов может быть несколько, и все стили хорошо закешируются браузерами и смена дизайна будет моментальной. Таким образом можно создавать безграничное количество внешних видов в одном приложении

Comments

[Владимир]

Спасибо за ответ, такой вариант мне очень понравился но меня просто интересовало есть ли такая возможность.

Answer 2

[Сергей]

Если правильно понял. Вам нужен прекомпилятор на сервере или на клиенте, т.е. где то должен быть разложенный исходник стилей. Но тут лучше хорошо подумать, честно, идиотская затея.

Comments

[Владимир]

Я понимаю что идея идиотская) Но мне интересовало есть ли такая возможность. Спасибо за ответ!

Answer 3

[Negwereth]

Нет

Comments

[Владимир]

Спасибо за ответ!) Я так и предполагал) Просто было интересно)