是否可以合併多個ng級

Question

是否可以通過用ng-class替換ng-switch來避免在此處重複代碼。

<li ng-repeat="el in elm.required"> 
    <span ng-switch on="el.type" > 
     <i class="icon-file" ng-switch-when="upload" tooltip="{{el.name}}" ng-class="{'muted':!el.completed}"></i> 
     <i class="icon-check" ng-switch-when="checkbox" tooltip="{{el.name}}" ng-class="{'muted':!el.completed}"></i> 
     <i class="icon-calendar" ng-switch-when="date" tooltip="{{el.name}}" ng-class="{'muted':!el.completed}"></i> 
     <i class="icon-pencil" ng-switch-when="text" tooltip="{{el.name}}" ng-class="{'muted':!el.completed}"></i> 
     <i class="icon-envelope" ng-switch-when="email" tooltip="{{el.name}}" ng-class="{'muted':!el.completed}"></i> 
    </span> 
</li> 

有這樣的事情（不工作，因爲有兩個NG-類指令）：

<li ng-repeat="el in elm.required"> 
    <i tooltip="{{el.name}}" ng-class="{upload:'icon\-file', checkbox:'icon\-check', 'date':'icon\-calendar', text:'icon\-pencil', 'email':'icon\-envelope'}[el.type]" ng-class="{'muted':!el.completed}" ></i> 
</li> 

Answer 1

而不是做一個角的版本，你可以只創建的.upload.checkbox等一個CSS類。映射到icon-*

<li ng-repeat="el in elm.required"> 
    <i tooltip="{{el.name}}" class="{{el.type}}" ng-class="{'muted':!el.completed}" ></i> 
</li> 

Example on jsfiddle