ng-Klasse mit Funktion und Ausdruck

Question

Ich muss zwei Klassen hinzufügen mit ng-Klasse, eine Klasse, die ich durch eine Funktion bekomme ich brauche, um durch einen Ausdruck zu bekommen - Unten ist Code, den ich benutze, aber einige Syntaxfehler -

<div class="field-icon" ng-class="getFieldClass(entry.entry_type_id) , 'used': entry_map[entry.guid] > 0" ></div> 

Was wäre korrekte Syntax, wenn es möglich ist, Funktion und Ausdruck zusammen zu verwenden.

Answer 1

Sie haben falsch ng-class Syntax, es im JSON-Format wie ng-class="{'used': expression2 }" sein sollte, Ausdruck Boolean auf Grundlage dieser Klasse zurückkehren wird aus der Klasse attribute Wert erhalten hinzugefügt oder entfernt.

Als Ihr getFieldClass Methode zurückgibt Klassennamen, dann können Sie Ihr beide Klassenlogik in getFieldClass Methode verschieben

Markup

<div class="field-icon" 
ng-class="getFieldClass(entry)" ></div> 

-Code

$scope.getFieldClass = function(entry){ 
    //use entry.entry_type_id here to decide class which is first 
    //'text-box-icon' class has been selected on some condition based on entry.entry_type_id 
    return {"text-box-icon": true, 'used': $scope.entry_map[entry.guid] > 0}; 
} 

Answer 2

sollten Sie sein kann so etwas machen:

<div class="field-icon" ng-class="getClasses(entry)"></div> 

wo Ihre Methode wie folgt aussieht:

$scope.getClasses = function(entry) { 
    var classes = {}; 
    if (entry_map[entry.guid] > 0) 
     classes['used'] = true; 

    if (various-logic) 
    classes['custom-class-one'] = true; 
    else if (various-logic) 
    classes['custom-class-two'] = true; 
    //etc 

    return classes; 
} 

Answer 3

Sie können die Funktion und Expression in Array schreiben.

Beispiel:

<div class="field-icon" ng-class="[getFieldClass(entry.entry_type_id), {'used':entry_map[entry.guid] > 0}]"></div> 

Live-Beispiel hier: https://plnkr.co/edit/OWfkAwJiombrehiS7p9o?p=preview