IE Unterstützung für mehrere Angular ng-Klasse Ausdrücke

Question

Ich habe ein Codebeispiel unten, wo ich nach Dateierweiterung suchen und dementsprechend das Symbol für die hochgeladene Datei festlegen. Da es mehrere Dateien unterstützt, habe ich für jedes von ihnen ein Icon gesetzt und basierend auf der Erweiterung verwende ich verwandte Klasse mit ng-class Attribut. Es funktioniert nicht in IE11. Ich überprüfte mit einzelnen Ausdruck, um zu bestätigen, und es hat funktioniert. Gibt es einen Workaround dafür?

<i flex ng-class="{ 
      'icon-pdf': (fileDetails['extention'].search('pdf') != -1), 
      'icon-word': (fileDetails['extention'].search('doc') != -1), 
      'icon-ppt': (fileDetails['extention'].search('ppt') != -1), 
      'icon-xls': (fileDetails['extention'].search('xlsx') != -1), 
      'icon-html': (fileDetails['extention'].search('html') != -1), 
      'icon-jpg': (fileDetails['extention'].search('jpg') != -1), 
         'icon-jpg': (fileDetails['extention'].search('png') != -1), 
      'icon-wit': (fileDetails['extention'].search('txt') != -1)}" 
> 
      </i> 

Answer 1

Ich habe nicht vor diesen Fehler lesen, aber man könnte eine Funktion erstellen, die die richtige Klasse zurückgibt, anstatt mehrere der mit ng-class Attribute wie so:

in Ihrer Vorlage:

<i flex ng-class="getIconClass(fileDetails['extention'].search)"></i> 

Und in Ihrem Controller:

function getIconClass(search) { 
    if(search('pdf') != -1) 
     return 'icon-pdf'; 
    if(search('doc') != -1) 
     return 'icon-word'; 
    if(search('ppt') != -1) 
     return 'icon-ppt'; 
    if(search('xlsx') != -1) 
     return 'icon-xls'; 
    if(search('html') != -1) 
     return 'icon-html'; 
    if(search('jpg') != -1 || search('png') != -1) 
     return 'icon-jpg'; 
    if(search('txt') != -1) 
     return 'icon-wit'; 
} 

Answer 2

ich fand heraus, ein Art und Weise, es zu tun, mit ng-class ternären Operator neben Martijn Weg (das ist sauberer). Um es zu erweitern, Wissen zu erweitern.

<i flex ng-class=" 
    fileDetails['extention'].search('pdf') != -1? 'icon-pdf': 
    fileDetails['extention'].search('doc') != -1 ? 'icon-word': 
    fileDetails['extention'].search('ppt') != -1? 'icon-ppt': 
    fileDetails['extention'].search('xlsx') != -1? 'icon-xls': 
    fileDetails['extention'].search('html') != -1? 'icon-html': 
    fileDetails['extention'].search('jpg') != -1? 'icon-jpg': 
    fileDetails['extention'].search('png') != -1? 'icon-jpg': 
    fileDetails['extention'].search('txt') != -1? 'icon-wit': 'icon-html' "></i>