Как совместить условный класс и связанный с данными класс в angularjs

Чтобы применить разные классы, когда разные выражения оцениваются как true:

<div ng-class="{'class1' : expression1, 'class2' : expression2}">
    Hello World!
</div>

Чтобы применить разные классы к классу данных, используя []

 <div ng-class="[class3, class4]">
        Hello World!
    </div>

Я хочу знать, можно ли комбинировать два типа шаблона, т.е. имеют условный класс, используя {} и связанный с данными класс, используя []?

Любая помощь будет принята с благодарностью.

Спасибо заранее.

Ответы

Ответ 1

Вы можете использовать следующий синтаксис

<div ng-class="[condition1 && 'class1', condition2 && 'class2', className]">
    Hello World!
</div>

className - это переменная в области видимости. Это значение применяется к div.

Вот пример скрипки Условно применить класс в angularjs

Ответ 2

Пожалуйста, смотрите демо ниже

var app = angular.module('app', []);

app.controller('homeCtrl', function($scope) {


  $scope.redClass = 'red';
  $scope.boldClass = 'bold';

});
.border {
  border: 1px solid red
}
.red {
  color: red
}
.bold {
  font-weight: bold
}
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div ng-app="app">
  <div ng-controller="homeCtrl">

    <p ng-class="[boldClass ,redClass,  1==1 ? 'border':'' ]">Hello Word</p>

  </div>
</div>