AngularJS ng-style Anweisung

AngularJS-Referenzhandbuch

Definition und Verwendung

ng-style Die Anweisung bestimmt die style Eigenschaft.

ng-style Der Wert des Attributs muss ein Objekt sein oder ein Ausdruck, der ein Objekt zurückgibt.

Der Objekt besteht aus CSS-Attributen und -Werten in der Form von Schlüssel-Wert-Paaren.

Beispiel

Verwenden Sie ein Objekt mit CSS-Schlüsseln und -Werten, um mit AngularJS einige Stile hinzuzufügen:

<body ng-app="myApp" ng-controller="myCtrl">
<h1 ng-style="myObj">Willkommen</h1>
<script>
var app = angular.module("myApp", []);
app.controller("myCtrl", function($scope) {
    $scope.myObj = {
        "color" : "white",
        "background-color" : "coral",
        "font-size" : "60px",
        "padding" : "50px"
    }
});
</script>
</body>

Probieren Sie es selbst aus

Syntax

<element ng-style="expression</element>

Alle HTML-Elemente unterstützen dies.

Parameter

Parameter Beschreibung
expression Ausdruck, der ein Objekt zurückgibt, wobei die Schlüssel CSS-Eigenschaften und die Werte CSS-Werte sind.

AngularJS-Referenzhandbuch