У меня есть список блоков, которые нарисованы внутри ng-repeat. Я использую сетку BootStrap, чтобы установить ширину каждого блока. Я хочу расширить блок при нажатии. По умолчанию блоки отрисовываются с использованием col-lg-2. Идея состоит в том, чтобы использовать col-lg-12 после события click (ng-click).
Кто-нибудь знает, как я применяю этот стиль к каждому блоку индивидуально, используя директивы ng-class или ng-style?
Спасибо.
2 ответа
Это довольно легко, используя комбинацию встроенных директив ng-click и ng-class:
<my-block ng-class="{'col-lg-12': item.clicked, 'col-lg-2': !item.clicked}"
ng-click="clickMe(item)"></my-block>
Затем в вашем контроллере вы бы сделали функцию видимости:
$scope.clickMe = function(item) {
item.clicked = !item.clicked;
};
Я предполагаю, что у вас есть массив объектов. Затем вы можете добавить дополнительное свойство в ваши объекты, называя его className в массиве. Установите его по умолчанию col-lg-2. В функции ng-click вы можете изменить значение свойства на col-lg-12, которое будет действовать индивидуально. Вам нужно использовать это свойство с ng-class, чтобы изменить класс.
Похожие вопросы
Новые вопросы
angularjs
Используйте для вопросов об AngularJS (1.x), JavaScript-фреймворке с открытым исходным кодом. НЕ используйте этот тег для Angular 2 или более поздних версий; вместо этого используйте тег [angular].