ng-repeat для отображения 6 разных значений в 6 разных окнах - PullRequest
Новая
       17

ng-repeat для отображения 6 разных значений в 6 разных окнах

0 голосов
/ 15 октября 2019

Я пытаюсь отобразить 6 разных чисел в 6 разных коробках. Мой код выглядит следующим образом, я повторяю один и тот же код с требуемым стилем CSS 6 раз, но это не работает. все, что мне нужно, это изображение ниже

, в котором есть 3 коробки, но мне нужно 6 коробок "как и так" 

<button class="button button4>
    <p ng-repeat="head in data.headers">
      {{data.rows[0].measure[$index].qtext}}
    </p>
</button>

1 Ответ

0 голосов
/ 15 октября 2019

Вы можете использовать селектор CSS :nth-child() для разных стилей в каждом из этих полей.

Для этого добавьте класс в <p>

<button class="button button4 ng-repeat="head in data.headers">
    <p class="myColorfulBox">
      {{data.rows[0].measure[$index].qtext}}
    </p>
</button>

и стилизуйтеЯщики независимо в соответствующем CSS: 

.myColorfulBox {
// this is styling for all boxes
}

.myColorfulBox:nth-child(1) {
// this is styling for the first box
  background-color: green;
}

.myColorfulBox:nth-child(2) {
// this is styling for the first box
  background-color: blue;
}

and so on ...
...