Я знаю, это звучит глупо, но я пишу редактор wysiwyg, который позволяет дизайнерам создавать руководства по стилю. Я очень увлекся двухсторонним связыванием в угловых и было любопытно, можно ли было двухстороннее связывание между листом CSS иng-model поле ввода. В настоящее время я делаю динамическое руководство по стилю, которое позволяет дизайнеру выбирать основные, второстепенные цвета страницы. Эти цвета изменят всю тему сайта равномерно, и было бы здорово сделать это из самой таблицы стилей.

HTML

<input type="text" ng-model="color.primary" />
<button class="btn primary-color" />

CSS

.primary-color {
  background: {{color.primary}};
}

JS $ scope.color {primary: '00f', Secondary: '# e58'}

Я знаю, что есть много директив, таких какng-style а такжеng-class Но я боюсь, что каждый тег должен быть директивой, потому что все может иметь тег ng-style / ng-class. Это делает мой код не очень сухим и сложным в обслуживании.

Что делать, если я хочу динамическое руководство по стилю CSS. Лист, который я мог бы хранить в виде парных ключевых значений CSS на сервере, например в Firebase, возможно, даже в 3way, связывая изменение цветов в реальном времени? Я почти уверен, что это не может быть достигнуто с использованием исключительно угловых ... есть ли у кого-нибудь идеи о предварительных компиляторах или взломах для выполнения этой задачи, чтобы это привело к одному чистому парню?