Angular js风格改变答案

【问题标题】：Angular js style changingAngular js风格改变
【发布时间】：2014-09-26 05:42:39
【问题描述】：

我有以下代码：

$scope.books.Name =$scope.books.Name+ '  (Disposed)';

HTML 代码是：它正在绑定文本。我希望 tp 为 $scope.books.Name 的 r.h.s 部分分配不同的颜色我该怎么做？我是角度 js 的新手。 OP IS：税收处置。我希望只更改税颜色。

【问题讨论】：

请提供您的代码，HTML/AngularJS。给定的信息不足以理解问题并查看您做了什么。

标签： javascript angularjs

【解决方案1】：

如果没有完整的代码，很难理解您想要实现的目标（也许我的英语很弱，但您对 r.h.s. 有什么看法？），无论如何，ngClass（和自定义 CSS 类）可能有用吗？

【讨论】：

【解决方案2】：

简单的答案是使用ng-class。这是一个工作示例：

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

app.controller('myCtrl', function() {
  var vm = this;
  
  vm.books = [{
    author: 'Dickens',
    title: 'A Christmas Carol',
    disposed: false
  },
  {
    author: 'Twain',
    title: 'The Adventures of Huckleberry Finn',
    disposed: true
  }];
});

.disposed {
  color: red;
}

th, td {
  padding: 2px 10px;
  text-align: left;
}

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

<div ng-app="myApp">
  <div ng-controller="myCtrl as C">
    <table>
      <tr>
        <th>Author</th>
        <th>Title</th>
      </tr>
      <tr ng-repeat="book in C.books">
        <td>
          {{book.author}}
        </td>
        <td>
          <span ng-class="{disposed: book.disposed}">
            {{book.title}}
          </span>
          <span ng-if="book.disposed">
            &nbsp;(Disposed)
          </span>
        </td>
      </tr>
    </table>
  </div>
</div>

【讨论】：