Javascript 在指令中编辑/添加ngClass

我试图创建一个指令来重构一些类

请看一看

我想从我的track指令中添加或编辑ng类属性，以避免这种重复代码（在ng类中）：

怎么做？ 它必须使用任何元素，并且必须使用任何现有的ng类属性（因此我需要扩展当前属性）：

在指令的控制器中创建

getClass（）

：

/。。。
控制器：功能（$scope）{
$scope.getClass=函数（）{
返回{
“轨道已停止”：$scope.trackState===“停止”，
“曲目正在播放，曲目已暂停”：$scope.trackState==“暂停”，
“正在播放曲目”：$scope.trackState==“播放”，
“曲目正在播放曲目正在缓冲”：$scope.trackState==“缓冲”
};
}
}

在视图中调用它：

您还可以安全地从重复的类中清除类对象：

/。。。
返回{
“轨道已停止”：$scope.trackState===“停止”，
“轨迹已暂停”：$scope.trackState===“暂停”，
“正在播放曲目”：$scope.trackState==“播放”，
“跟踪正在缓冲”：$scope.trackState===“缓冲”
}

---

你说的“怎么做”是什么意思。你有什么特别的问题吗？请看我编辑的问题。

<table>
  <tr ng-repeat="track in tracks"
      ng-class="{
        'track-is-stopped': trackState === 'stop',
        'track-is-playing track-is-paused': trackState === 'pause',
        'track-is-playing': trackState === 'play',
        'track-is-playing track-is-buffering': trackState === 'buffering'
      }"
      track>
      <td>{{ track.title }}</td>
  </tr>
</table>

  <div ng-class="{ 
       selected: selected,
       'track-is-stopped': trackState === 'stop',
       'track-is-playing track-is-paused': trackState === 'pause',
       'track-is-playing': trackState === 'play',
       'track-is-playing track-is-buffering': trackState === 'buffering'           
     }" 
     ng-repeat="track in tracks"
     track>{{ track.title }} 
</div>

      ng-class="{
        'track-is-stopped': trackState === 'stop',
        'track-is-playing track-is-paused': trackState === 'pause',
        'track-is-playing': trackState === 'play',
        'track-is-playing track-is-buffering': trackState === 'buffering'
      }"

ng-class="{ selected: selected }"