在 Angular 中，在 class 中使用 ng-bind

Question

在Angular下我可以写：

class="{{ DayTypesClasses[request.typeId] }}"

根据表达式值

设置css-class

但我发现 ng-bind 可以实现相同的效果，而且还可以节省一些时间来进行此绑定。

我尝试在 class 中使用 ng-bind，但它不起作用。

class="ng-bind : 'DayTypesClasses[request.typeId]'"
class="ng-bind = 'DayTypesClasses[request.typeId]'"
class="ng-bind : DayTypesClasses[request.typeId]"
class="ng-bind:{{DayTypesClasses[request.typeId]}}"

我应该如何正确地在 class 属性中使用 ng-bind？

Link on documentation of ng-bind 对我没有帮助:(

Answer 1

这是标准示例并且正在运行：

<!doctype html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Example - example-example61-production</title>


  <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular.min.js"></script>



</head>
<body ng-app="bindExample">
  <script>
  angular.module('bindExample', [])
    .controller('ExampleController', ['$scope', function($scope) {
      $scope.name = 'Whirled';
    }]);
</script>
<div ng-controller="ExampleController">
  <label>Enter name: <input type="text" ng-model="name"></label><br>
  Hello <span class="ng-bind: name"></span>!
</div>
</body>
</html>

Plunker

Answer 2

您可以使用 ng-class，或者

<ANY ng-class="expression"> ... </ANY>

或

<ANY class="ng-class: expression;"> ... </ANY>

例如：

<p ng-class="{strike: deleted, bold: important, 'has-error': error}">Some example</p>

Answer 3

您期望的是将 $scope 变量的值替换为 class，为此您可以使用 ng-class。你只是误解了这个概念。 ng-bind 是一个指令，您可以以不同的方式使用它，将 $scope 变量的内容添加到该属性值的标记中。

你可以在下面的代码中看到，我在这两种方式中都使用了 ng-class。 More about ng-class

<div ng-app>
  <h2>Todo</h2>
  <div ng-controller="TodoCtrl">

     <span class="ng-class:myClass">Demo text</span>
     <span ng-class="myClass">Demo text</span>
  </div>
</div>

JSFiddle

在 Angular 中，在 class 中使用 ng-bind

In Angular use ng-bind in class

javascript

angularjs

ng-bind

class-attributes