AngularJS ngClass表達式和數組組合

Question

在AngularUI Bootstrap模式的視圖中，我目前在ng-class有以下表達式：

<div class="modal-body mdl-body"
     ng-class="{ 'is-msg': vm.message.type == 'msg',
                 'height-limit': vm.message.hasHeight }">

但我也想傳遞一組自定義類，如下所示：

ng-class="vm.message.classes"

這是在控制器中調用模態的地方：

modalService.open({
  type: "okay",
  title: "Terms & Conditions",
  content: $scope.APISettingData.signup_term_and_condition,
  classes: ["h-md", "text-info"],
  isHtml: true,
  hasHeight: true
});

兩種方式都沒有相互作用，但是當我試圖將它們組合起來時它們不起作用。

是否有可能做到這一點？ 請告訴我一些想法和解決方案。

Answer 1

還有另一種語法看起來像這樣

<div ng-class="[custom1, custom2, {'text-danger': isBadJuJu()}]">Some Text</div>

其中custom1和custom2是控制器范圍內的變量，而{}是一組表達式，就像您在第一個示例中使用的語法一樣

Answer 2

最好將ng-class分配給scope的變量。 即ng-class = customClasses

並在controller這樣的事情。 這樣做可以讓您完全控制必須在模態上應用的類。

編輯：在plnkr中檢查此示例應用程序

$scope.customClasses = {
   'is-msg': $scope.message.type == 'msg',
   'height-limit': $scope.message.hasHeight,
   "h-md" : true, 
   "text-info": true
};