Мне нужно установить собственный стиль динамического div. Div соответствуют баллу:
<div class="row">
<div id={{'letter'+$index}} ng-style="{{theStyle}}" class="col"
ng-repeat="letter in letters track by $index">{{letter}}
</div>
</div>
Цвет каждой буквы должен определяться в зависимости от уровня и значения индекса, объявленного в массиве. У меня три уровня (низкий, средний, высокий), поэтому низкий стиль, средний стиль и стиль. Массив может быть, например: ['color': 'white', 'border-color': 'blue',..., 'color': 'white', 'border-color': 'red']. Для каждой буквы есть элемент массива.
Не могли бы вы предложить разумное решение для этого случая?
благодаря
EDIT: переменные, используемые в контроллере:
var word = getWord(objectWord, getLanguage());
$scope.letters = word.split('');
$scope.level = getLevelCSS(getLevel());
var arrStyles = getStyles(letters.length);
Вы можете передать свой стиль ng как директиву
<div ng-style="changetheColor(style-level, colorinfo)" colordirective></div>
И директива выглядела бы так.
.directive('colordirective', function (Ls) {
return function (scope, element, attr) {
scope.changetheColor = function (level, color) {
if(level == 'medium'){
return color;
}else if(level == 'high'){
return color;
}
}
}
})
Если u хочет, чтобы u мог передать уровень и информацию о стиле из массива и вернуть его в директиве