У меня есть много кнопок на странице и вход для ввода пользователем цвета.Как добавить динамические стили ко многим элементам в Angular
Есть ли лучший способ, чем под кодом?
<button ng-style="myStyles">
<button ng-style="myStyles">
.....
....
<input type="text" ng-modal="myStyles.color">
Можно ли создать динамический класс, как показано ниже?
<style>
button {
color : {{myStyles.color}}
}
</style>
Попробуйте следующее ...
<button ng-class="{color: myStyles.color}">
<input type="text" ng-model="myStyles.color">
Вы можете увидеть рабочий пример here.
Легкий и простое решение
<html>
<div id="a1">
<button>button 1</button><br/>
<button>button 2</button><br/>
<button>button 3</button><br/>
<input type="text" onkeyup="Fn1()" id="data" />
</div>
<script type="text/javascript">
function Fn1(){
var z = document.getElementById("data").value;
var x = document.getElementById("a1");
var y = x.getElementsByTagName('button');
for(var i = 0;i<y.length;i++)
{
y[i].style.color=z;
}
}
</script>
</html>
Найдено решение, директива интерполировать внутри тега http://alexbaden.me/interpreting-data-binding-in-style-tags-with-angular/
Я предполагаю, что вы имели в виду 'нг-model' в вашем' input' (не 'нг-модальный ')? – sfletche